Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
260
Row Selection with Paging
posted

I'm having some difficulty with programatically selecting a row when also using paging and sorting.

In my scenario, I have an igGrid, with 10 records per page.  

$("#grid").igGridSelection("selectRowById", itemId) will select the row but then I wish to set the page to the page that contains the actual item.  

Is it possible to get the row index from the selected row?  If so, even if the grid is sorted, I could determine the page the item will be on.

Or, any advice as to what the best approach would be here?

Thank you!

Parents
No Data
Reply
  • 17590
    Verified Answer
    Offline posted

    Hello Mike,

    What I can suggest for achieving your requirement is creating a function that gets the id of the row that you would like to select as a parameter. In this function you could select the row using the selectRowById method. Afterwards, in order to retrieve the actual, index of this row in the underlying data source the data should be looped. Since igGrid data source contains an array of the rows in their actual order this means that if the grid is sorted row indexes in the data source are going to be the actual ones. Once we have the row index we should calculate the page index based on the page size. Afterwards, using pageIndex method current page could be set. For example:

    function goToPageWithSelectedRecord(id){
      $("#grid").igGridSelection("selectRowById", id);
       var  currDS = $("#grid").data("igGrid").dataSource.data(), pageSize = $("#grid").igGridPaging("pageSize"), newPageIndex;
       //loop data source in order to find the index of the record with matching id
       $.each(currDS, function(index){
        if(this.ProductID == id){
        currRowindex = index;
        }
       })
       //determine the pageIndex
       newPageIndex = Math.floor(currRowindex/pageSize);
       $("#grid").igGridPaging("pageIndex", newPageIndex);
      }

    I am also attaching a small sample illustrating my suggestion for your reference.

    Please have a look at this small application and do not hesitate to contact me if you have any additional questions afterwards.

    igGridSelectRowsWithSortingAndPaging.zip
Children