We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Rows Selection & Pagination

Hi,

I have a grid with a checkbox column to select the rows.

However, if i select few records in Page 1 and few in Page 2, getSelectedRows method gives the rows selected in Page 2 only.

Previous page selected rows are automatically unchecked when i move to different page.

How can i overcome this issue??!!.

3 Replies

VA Venkatesh Ayothi Raman Syncfusion Team December 6, 2016 07:13 AM UTC

Hi Indrani, 
Thanks for contacting Syncfusion support. 

The getSelectedRecords method will return only the current page selected records.  
In this, we can get the stored selected records and current page selected records and merge the both array’s using ej.merge function. We have achieved your requirement using additional property for storing the selected records in the grid, 
Code example
@Button 
<input type="button" value="GetSelectedRecords" id="SelectedRecords" /> 
@Grid 
@(Html.EJ().Grid<OrdersView>("FlatGrid") 
        .Datasource((IEnumerable<object>)ViewBag.datasource) 
        .AllowPaging()         
         
                                    .ClientSideEvents(eve => 
                                    { 
                                 
                                    eve.ActionBegin("actionBegin"); 
                                    eve.DataBound("dataBound");}) 
 
        .Columns(col => 
        { 
            col.Type("checkbox").Width(50).Add(); 
              . . . 
 
        })) 
 
@dataBound 
 
    function dataBound(args) { 
        this.model.records = {}; /* Additional property*/ 
    } 
@actionBegin 
function actionBegin(args) { 
        if (args.requestType == "paging") { 
            if (this.selectedRowsIndexes.length > 0) 
                this.model.records[args.previousPage] = this.getSelectedRecords(); //Store the selected records  
        } 
    } 
@Button function 
$("#SelectedRecords").ejButton({ click: "getMergedSelected" }); 
 
    function getMergedSelected() { 
 
        var obj = $("#FlatGrid").ejGrid("instance"); 
 
        var r = obj.model.records, selected = []; 
 
        for (var p in r) { 
            ej.merge(selected, r[p]); 
        } 
 
        ej.merge(selected, obj.getSelectedRecords()); 
 
        return selected;// All selected records 
    } 
 

Help document


Regards, 
Venkatesh Ayothiraman. 



IG indrani Gajjarapu December 8, 2016 10:15 AM UTC

Hi Venkatesh,

Thank for the reply..It worked..


MF Mohammed Farook J Syncfusion Team December 9, 2016 04:26 AM UTC

Hi Indrani
  
Thanks for updated.  
  
Regards, 
J.Mohammed Farook 


Loader.
Up arrow icon