Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to get kendo ui grid sort event?

Tags:

kendo-ui

I currently have a Kendo-UI grid. It has a few column where user can sort on, works great. I also have a details link on each row, so if the user clicks on this they are taken to a details page. I need to pass the current sort into the details page as a value. How can I get the current sort? is there an event I can bind to? Thanks

like image 712
user2206329 Avatar asked May 15 '13 02:05

user2206329


People also ask

How do I enable sorting in kendo grid?

To enable the sorting when the kendoGridBinding directive is applied: Set the sortable option of the Grid. (Optional) Set the sort property to a collection of SortDescriptor objects. This allows you to sort the data by specific criteria during the initialization of the Grid.

How do I set default sort in kendo grid?

By default, the Grid applies single-column sorting when the Sortable() method is enabled. Alternatively, you can configure single-column sort mode by setting the [ SortMode ]{% if site. core %}(/api/Kendo. Mvc.

What is Pageable in kendo grid?

kendo:grid-pageable-messagesThe text messages displayed in pager. Use this option to customize or localize the pager messages.

What is Databound in kendo grid?

Fired when the widget is bound to data from its data source. The event handler function context (available via the this keyword) will be set to the widget instance.


2 Answers

You can get the sorting configuration whenever you want using sort method.

Example: Being grid the id of your Grid. Do:

// Get the grid object
var grid = $("#grid").data("kendoGrid");
// Get the datasource bound to the grid
var ds = grid.dataSource;
// Get current sorting
var sort = ds.sort();
// Display sorting fields and direction
if (sort) {
    for (var i = 0; i < sort.length; i++) {
        alert ("Field:" + sort[i].field + " direction:" + sort[i].dir);
    }
} else {
    alert("no sorting");
}
like image 118
OnaBai Avatar answered Sep 22 '22 03:09

OnaBai


I ran into this need today and learned that the event is now present as of 2016 R3 release (2016.3.914).

Example usage:

<div id="grid"></div>
<script>
  $("#grid").kendoGrid({
    columns: [
      { field: "name" },
      { field: "age" }
 ],
dataSource: {
  data: [
        { id: 1, name: "Jane Doe", age: 30 },
        { id: 2, name: "John Doe", age: 33 }
     ],
     schema: {
       model: { id: "id" }
     }
   },
   sortable: true,
    sort: function(e) {
      console.log(e.sort.field);
      console.log(e.sort.dir);
    }
  });
</script>

See: http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-sort

like image 20
Brian Edwards Avatar answered Sep 23 '22 03:09

Brian Edwards