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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Retain last selected row and page in Grid after postback

Thread ID:

Created:

Updated:

Platform:

Replies:

144600 May 14,2019 07:26 AM UTC May 20,2019 04:24 AM UTC ASP.NET Core - EJ 2 3
loading
Tags: DataGrid
Mani
Asked On May 14, 2019 07:36 AM UTC

Hi,

I am implementing EJS syncfusion grid server side pagination and search by web api adaptor as i mentioned below screen shot. 

When click "Edit" icon or "Row double click" it will go to Edit page. When submit it will be back to grid. Here i want to retain the "Double click row should be selected" and "Page", "search" also retain. Please help me to solve this. 

I am using asp.net core 


Here is my server side code for Paging and Searching,




Pavithra Subramaniyam [Syncfusion]
Replied On May 16, 2019 08:42 AM UTC

Hi Mani, 
 
Greetings from the Syncfusion support, 
 
As we have validated your code example and created a sample with your requirements. In below code example, you can retain the Search, Paging and Selection of EJ2 Grid when double click on the EJ2 Grid row using the “dataBound”, “recordDoubleClick” events in which you can save the Grid  state into local storage and then reset it while returning to the Grid. Please refer the code example and sample for more information. 
 
[index.cshtml] 
 
<ejs-grid id="Grid" allowPaging="true" dataBound="onDataBound" recordDoubleClick="ejsGridDoubleClick" toolbar="@(new List<string>() {"Search" })"> 
    <e-data-manager id="myData" url="/api/Orders" adaptor="WebApiAdaptor" crossDomain="true"></e-data-manager> 
    
    <e-grid-columns> 
        <e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="120"></e-grid-column> 
        <e-grid-column field="CustomerID" headerText="Customer Name" width="150"></e-grid-column> 
        <e-grid-column field="ShipCity" headerText="Ship City" width="170"></e-grid-column> 
        <e-grid-column field="ShipCountry" headerText="Ship Country" template="<a>${ShipCountry}</a>" width="150"></e-grid-column> 
    </e-grid-columns> 
</ejs-grid> 
 
<script> 
 
    var selectIndx; 
    var flag = false; 
    function onDataBound(args) { 
        // Get the EJ2 Grid currentPageIndex, selection index and search string value from local storage 
         // you can also add conditions based on your requirement here 
        var currentPageIndex = parseInt(window.localStorage.getItem("pageIndex"), 10); 
        var selectedRowIndex = parseInt(window.localStorage.getItem("selectIndex"), 10); 
        var searchString = window.localStorage.getItem("searchString"); 
        if ((selectedRowIndex && currentPageIndex == 1) || flag) { 
            selectIndx = selectedRowIndex ? selectedRowIndex : selectIndx; 
            this.selectRows([selectIndx]); 
            window.localStorage.removeItem("selectIndex");   // once set the selection index to grid then, we have reset the local storage            
        } 
        if (currentPageIndex) { 
            this.pageSettings.currentPage = currentPageIndex; 
           window.localStorage.removeItem("pageIndex"); 
            flag = true; 
        } 
        if (searchString) { 
            this.search(searchString); 
            window.localStorage.removeItem("searchString"); 
        } 
    } 
     
    function ejsGridDoubleClick(args) {   
       // Here, we have set the EJ2 Grid currentPageIndex, selection index and search string value to localstorage       
        window.localStorage.setItem("pageIndex", this.pageSettings.currentPage ); 
        window.localStorage.setItem("selectIndex", args.rowIndex);  
        window.localStorage.setItem("searchString", this.searchSettings.properties.key);  
         
        if (window.location.rel='nofollow' href.split("Home").length > 1) { 
            window.location.rel='nofollow' href = window.location.rel='nofollow' href.split("Home")[0] + "Home" + "/About" 
        } else { 
            window.location.rel='nofollow' href = "Home/About" 
        } 
    } 
     
</script> 
 
                               https://ej2.syncfusion.com/javascript/documentation/api/grid/#recorddoubleclick 
 
 
Please get back to us, if you any further assistance. 
 
Regards, 
Pavithra S. 


Mani
Replied On May 18, 2019 07:41 AM UTC

Hi Pavi,

I think your solution is working fine. Thank you so much.

Pavithra Subramaniyam [Syncfusion]
Replied On May 20, 2019 04:24 AM UTC

Hi Mani,  

Thanks for your update. 

We are happy to hear that the provided solution is working. 

Please contact us if you need any further assistance. As always, we will be happy to assist you.  

Regards,  
Pavithra S. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon