Prevent Specific Column Reordering in Grid

Environment

Product	Progress® Kendo UI® Grid for jQuery
Product Version	Created with the 2017.3.1026 version

Description

How can I prevent a specific column to be reordered in the Kendo UI Grid?

Suggested Workaround

The Kendo UI Grid does not provide a built-in solution for achieving this behavior. However, you can still work around the issue.

1. In the dataBound event handler, save the column in a global variable.
2. In the columnReorder event handler, use the reorderColumn method to position the column in the desired spot.

<div id="grid"></div>
<script>
    var nonReordableColumn;

    $("#grid").kendoGrid({
      columns: [
        { field: "fname" },
        { field: "lname" },
        { field: "age" }
      ],
      dataSource: [
        { fname: "Jane", lname: "Doe", age: 30 },
        { fname: "John", lname: "Doe", age: 33 }
      ],
      dataBound: function(e){
        nonReordableColumn = e.sender.columns[0];
      },
      reorderable: true,
      columnReorder: function(e) {
        var grid = e.sender;

        setTimeout(function (e) {
            grid.reorderColumn(0, nonReordableColumn);
        }, 1)
      }
    });
</script>