This is a migrated thread and some comments may be shown as answers.

Sorting columns does not reset to first page

2 Answers 151 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Tim Eck
Top achievements
Rank 1
Tim Eck asked on 31 May 2013, 07:26 PM
I need to reset to the first page after sorting the grid. I was trying to use the change event like i was doing when changing page which works perfectly here is my example on how I keep track of my paging.
   var pageable = false;
          if (self.Pageable == true)
              pageable = {
                  refresh: false,
                  pageSizes: self.PageSizes,
                  change: function(e) {
                      if (typeof (Storage) !== "undefined") {
                          localStorage.setItem(self.PageStorageVariable, self.Grid().dataSource.page());
                      }
                  }
              };

and then apply pageable variable to my grid definition
   var g = {
              scrollable: false,
              pageable : pageable ,
              ...
  }

Every time I change a page it gets stored in my local storage and then I do some stuff with it.

I need the same functionality for sorting but only on the on change event:

  var sortable = false;
          if (self.Sortable == true)
              sortable = {
                  mode: "single",
                  allowUnsort: true,
                  change: function (e) {
                      console.log('here');
                  }
              };

          var g = {
              scrollable: false,
              pageable : pageable ,
              sortable : sortable,
             ...
         };

But in this case every time I apply a new sort its not firing my on change function, any ideas on how can I intercept the onSort event so I can reset to page 1 when sorting?

2 Answers, 1 is accepted

Sort by
0
Accepted
Petur Subev
Telerik team
answered on 04 Jun 2013, 03:21 PM
Hello Tim,

Basically such behavior is not supported. However you can try to use the dataSource requestStart event to check if the Grid is about to sort, if it is then prevent the requestStart event and use the query method to perform sorting + paging to the first page.

e.g.

requestStart:function(e){
  var newState = JSON.stringify(this.sort()); 
  if(newState!=sortState){ //where sortState is a global variable
    sortState = newState;
    e.preventDefault();
    this.query({sort:this.sort(),page:1});
  }
},

Let me know your findings.

Kind Regards,
Petur Subev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Tim Eck
Top achievements
Rank 1
answered on 04 Jun 2013, 11:02 PM
Hi Petur,

Thanks for your response. I did try using requestStart but I needed something more specific since every request (load, change page, sorting, etc) use this method, I wanted to avoid verifying the sort() function since there can be request where sort is null but not necessarily means that sort hasn't change.

I have implemented a solution that works as expected, but I wanted to know if there was a more elegant way to do it instead of checking sort every request.
Tags
Grid
Asked by
Tim Eck
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Tim Eck
Top achievements
Rank 1
Share this question
or