Get column index on behalf of a column in a Kendo grid in Javascript

Is there a way to find out the index of a column in a grid if we know the column name in the Kendo grid?

eg.

EmployeeID| Name 123 | John 

I want to know the index of the "Name" field, that is, 1 in the grid. Any suggestions.

Thanks.

Sanjeev

+5
source share
2 answers

Try using the code snippet below.

 <!DOCTYPE html> <html> <head> <title>Jayesh Goyani</title> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2015.2.902/styles/kendo.common-bootstrap.min.css" /> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2015.2.902/styles/kendo.bootstrap.min.css" /> <script src="https://kendo.cdn.telerik.com/2015.2.902/js/jquery.min.js"></script> <script src="https://kendo.cdn.telerik.com/2015.2.902/js/kendo.all.min.js"></script> </head> <body> <div id="example"></div> <input type="text" id="txtColumnName" /> <button onclick="GetColumnIndexFromName();">GetIndex</button> <script> $(document).ready(function () { $("#example").kendoGrid({ dataSource: { type: "odata", transport: { read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers" }, pageSize: 20 }, height: 550, groupable: true, sortable: true, pageable: { refresh: true, pageSizes: true, buttonCount: 5 }, columns: [{ template: "<div class='customer-name'>#: ContactName #</div>", field: "ContactName", title: "Contact Name", width: 240 }, { field: "ContactTitle", title: "Contact Title" }, { field: "CompanyName", title: "Company Name" }, { field: "Country", width: 150 }] }); }); function GetColumnIndexFromName() { var index = -1; var strName = $("#txtColumnName").val(); var grid = $("#example").data("kendoGrid"); var columns = grid.options.columns; if (columns.length > 0) { for (var i = 0; i < columns.length; i++) { if (columns[i].field == strName) { // columns[i].title -- You can also use title property here but for this you have to assign title for all columns index = i; } } } if (index == -1) { alert("column name not exists"); } else { alert("column index is:- " + index); } } </script> </body> </html> 

Let me know if there is any problem.

+6
source

This code will give the column object:

 var grid = $('#grid').getKendoGrid(); grid.columns.find(function(v, i) { return grid.columns[i].field == 'myColumnName'; }) 

Of course, you can configure the filter further if you want.

+2
source

Source: https://habr.com/ru/post/1238576/


All Articles