javascript - Dynamically setting the sortable property of a kendo grid column

Question

I'm trying to set a kendo grid column's sortable property via a variable to control when the column can have sorting facility and when it can't. But this is not working. If I directly set the sortable property to true/false it works accordingly, but when I'm using a variable to set it, it is not, regardless of the variable value, the property is always set to 'true'.

Example:

This works as expected.

<div id="grid"></div>
<script>
$("#grid").kendoGrid({
  columns: [
    { sortable: false, field: "id" },
    { field: "name" }
  ],
  sortable: true,
  dataSource: [ { id: 1, name: "Jane Doe" }, { id: 2, name: "John Doe" } ]
});
</sript>

But this does not, id field always gets sortable property as true

<div id="grid"></div>
<script>
// if first time it's true, then the sortable property is retaining true always, 
// regardless if on second call the variable is set to false. there is no effect
var setColumnSort = canBeFalseOrTrue;
$("#grid").kendoGrid({
  columns: [
    { sortable: setColumnSort, field: "id" },
    { field: "name" }
  ],
  sortable: true,
  dataSource: [ { id: 1, name: "Jane Doe" }, { id: 2, name: "John Doe" } ]
});
</script>

Is there anyway to dynamically disable/enable sorting of a column in a kendo grid?

标签： javascriptjquerykendo-grid

Answer 1

You need to set it dynamically through grid properties once the grid is initialized.

$('#grid').kendoGrid({
  sortable: true,
  columns: [
    {...}
  ]
});

var grid = $('#grid').getKendoGrid();

var options = grid.options;
options.columns[0].sortable = false;
grid.setOptions(options);

Example: Enable/disable sorting on column