New to Kendo UI for jQueryStart a free 30-day trial

Prevent Specific Column Reordering in Grid

Environment

ProductProgress® Kendo UI® Grid for jQuery
Product VersionCreated 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>