Kendo UI for MVC Grid How do I hide the ID column

Alan Fisher picture Alan Fisher · Jun 26, 2012 · Viewed 9.4k times · Source

I would like to hide the ID column of a Kendo grid but still be able to reference it for other actions. I tried making the Width = 0 but that only makes it really wide.

@(Html.Kendo().Grid(Model)
        .Name("LineItems")
        .Columns(columns =>
            {
                columns.Bound(o => o.ID).Width(1);
                columns.Bound(o => o.Ui).Width(20);
                columns.Bound(o => o.QtyOrdered).Width(20);
                columns.Bound(o => o.Nomenclature).Width(200);
                columns.Bound(o => o.QtyShipped).Width(140);
                columns.Bound(o => o.QtyReceived).Width(200);
                columns.Bound(o => o.Hazmat).Width(50);

            })

Edit on June 26

OK I was able to get a reasonable solution based on a post from the Kendo forum. As long as the ID is defined in the datasource, the column does not have to be defined in the grid. You still have access to the ID value. I wrote a quick snippet to prove it and it returns the ID without the ID column in the grid.

<script>
  $(document).ready(function () {
      $("#btn").on("click", function () {

          var grid = $("#LineItems").data("kendoGrid");
          var data = grid.dataSource.data();
          $.each(data, function (i, item) {
              alert(item.ID);
           });
      });
  });
</script>

Answer

Atanas Korchev picture Atanas Korchev · Jul 18, 2012

Hidden columns are supported since the Q2 2012 release. You can now use the Hidden() setting.