Kendo Grid Column Show/hide Making Issue With 80+ Columns

I have a kendo grid with around 80 columns. Based on some logic I am hiding/showing columns. First 20 columns are static, and rest 60 depends on number of employees(eg:- if 20 empl

Solution 1:

I have resolved this issue. It was taking time when we are using hideColumn() and showColumn() methods of kendo grid. So I just replaced it with normal jQuery hide() and show() methods.

Check below code

I have replaced

if (empList[listIndex].Name.toString() == "HideColumn") {                                   
    $('#grdEmployees').data("kendoGrid").hideColumn(dataField);
} else {   
    $('#grdEmployees').data("kendoGrid").showColumn(dataField);  
}  

with

var colIdx = $(this).index() + 1; 
if (crewNameList[listIndex].Name.toString() == "HideColumn") {                        
    $("#grdEmployees table th:nth-child(" + colIdx + "),td:nth-child(" + (colIdx) + "),col:nth-child(" + (colIdx-1) + ")").hide();                      
} else {                        
    $("#grdEmployees table th:nth-child(" + (colIdx) + "),td:nth-child(" + (colIdx) + "),col:nth-child(" + (colIdx-1) + ")").show();                           
}

It will be useful for you.