user1076698 user1076698 - 10 months ago 152
C# Question

How can I hide columns in a Kendo UI Grid

I'm working on a HTML5 and JavaScript website.

Is it possible to have a hidden column in Kendo UI Grid and access the value using JQuery?


See the Kendo UI API definition.

Hiding during grid definition

Using the JavaScript implementation you can add hidden: true:

  columns: [
    { hidden: true, field: "id" },
    { field: "name" }
  dataSource: [ { id: 1, name: "Jane Doe" }, { id: 2, name: "John Doe" } ]

Or, with Kendo MVC you can use Hidden():

    .Columns(columns =>
        columns.Bound(m => m.Id).Hidden()
        columns.Bound(m => m.Name)

Hide a column by css selector

$("#gridName").find("table th").eq(1).hide();

Hide a column by column index

var grid = $("#gridName").data("kendoGrid");

Hide a column by column name

var grid = $("#gridName").data("kendoGrid");

Hide a column by column object reference

var grid = $("#gridName").data("kendoGrid");