Question

I want to switch page and select a row on grid when page loaded. And in $(document).ready(function()) I write this:

$("#myGrid").data("kendoGrid").dataSource.page(17);

And it’s working: the grid page is switched to 17. But right after that I write:

$("#myGrid").data("kendoGrid").select($("#myGrid").data("kendoGrid").tbody.find('>tr').find('>td').filter(function () {return $(this).text() == "@Model.ActionId";}).parent('tr:first'));

And it’s not working. But when I run this command from browser’s console, the row is selected. What should I do?

Answer 1

Probably your grid is bound to a remote service. In that case paging doesn’t happen immediately. The grid’s data source makes asynchronous request to the remote service and the grid is rebound when the response is received.

To make it work you need to call the selection code after response is received. The dataBound event of the grid is the proper place to call that code. Here is an example:

$("#myGrid").kendoGrid({
   /* other configuration */
   dataBound: function() {
      this.select(this.tbody.find('>tr').find('>td').filter(function () {return $(this).text() == "@Model.ActionId";}).parent('tr:first'));
   }
});