Kendo UI Grid - Hide / Show Column in MVC3

My case is a search box with 20 properties in which the user can select search criteria. Each property has a corresponding flag that toggles if prop is included in the search result or not. The search result is displayed in the kendo grid.

Simplified code that should illustrate the problem (kendo ui complete ver. 2012.2.710):

<input type="checkbox" onclick="fnShowHide(1);" name="showSearchColumn" id="checkShowField1"  />                                

<div id="example" class="k-content">
    <div id="kendoGridTest"></div>
</div>

<script>
function fnShowHide( iCol )
{
   $('#kendoGridTest').data("kendoGrid").options.columns[iCol].hidden = false;
   $('#kendoGridTest').data("kendoGrid").refresh();
}
</script>

The MVC3-controller method returns data from a search of type JsonResult (given as jsonResultSearchResultbelow):

$('#kendoGridTest').kendoGrid({
    dataSource: jsonResultSearchResult,
    schema: {
        model: {
            fields: {
                FirstName: { type: "string" },
                LastName: { type: "string" },
                Address: { type: "string" }
            }
        }
    },
    sortable: true,
    resizable: true,
    columns: [{
        field: "FirstName",
        width: 90,
        title: "First name"
    },
        {
            field: "LastName",
            width: 120,
            hidden: true,
            title: "Last name"
        },
        {
            field: "Address",
            width: 140,
            title: "Adr"
        }
    ]
});

After performing the search, the grid is filled with the necessary data, but is LastNamereally hidden. But if now the user is checking the control checkShowField1, I would like the grid to refresh with all three columns. Is not. fnShowHide()not doing this job.

, - Columns QuickWatch VS. fnShowHide , , .hidden, .

, / cols, Telerik .

+5
1

JavaScript, hideColumn(), , , showColumn(). - , , . :

var grid = $('#GridID').data('kendoGrid');
grid.hideColumn(2);
//or show it
grid.showColumn("OrderDate") // lets say thats the field name of the same column

, , , / MVC Wrappers, .

+16

All Articles