How to set Column Priority in Kendo Grid

Question

I'm using kendo grid and I've Columns array like below

 columns: [
            {
                field: "Column1",
                title: "Column 1",
                width: "120px"
            },
            {
                field: "Column2",
                title: "Column 2",
                width: "120px"
            },
            {
                field: "Column3",
                title: "Column 3",
                width: "160px"
            },
            .
            .
            .
          ]

How to set the order of the columns display in kendo grid or Is it possible any other way? Like 1st Column2 and then Column3 and then Column1 need to be displayed.

Thanks in Advance!!!!

Do you want to set the order only during the grid's initialization or do you want the ability to set the order dynamically using code later as well? — Shai

dev_in_progress dev_in_progress · Accepted Answer · 2020-12-07T12:33:36

You are looking for reorderColumn(destIndex, object) event: reorderColumn.

destIndex Number The new position of the column. The destination index should be calculated with regard to all columns, including the hidden ones.

column Object The column whose position should be changed.

$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
      { name: "Jane Doe", age: 30 },
      { name: "John Doe", age: 33 }
  ]
});
var grid = $("#grid").data("kendoGrid");

//your logic for calcualting destination index and column
grid.reorderColumn(1, grid.columns[0]);

Offical example: reorderColumn

How to set Column Priority in Kendo Grid

1 Answers