Problem with grid sorting on document ready

[Edwin Kurniawan]

Hi admin, I have problem with ejGrid.

When i perform sorting on document ready (javascript) with my sort settings from serverside (i have saved sort settings state into database and load it),

and then assign the grid's datasource with a data manager (url adaptor), the sort settings state got reset.

How to persist sort column state when assigning the data source (initially null because i want to load the data source after doing some work after page loaded)?

Attached code:

var dataManagerId = xxx; //same as EJ().DataManager's id set on razor page

var sortColList = {//loaded from serverside};

$(function () {

      _customerGrid = $('#myCustomerGrid').ejGrid('instance');

      _customerGrid.option('sortSettings', sortColList);
      _customerGrid.option({ dataSource: dataManagerId }); //after setting datasource, sortSettings getting reset.

      //If i set datasource before i set the sortSettings, double ajax request will be sent (want to avoid this)

});

[Farveen Sulthana Thameeztheen Basha]

Hi Edwin, 

Thanks for contacting Syncfusion Support. 

Query#1:- How to persist sort column state when assigning the data source (initially null because i want to load the data source after doing some work after page loaded)? 

We have checked your query and when we set sortSettings before the dataSource, while updating the dataSource we have empty the sort, filter columns in our source side because when we doesn’t have such columns it will throw script Error. Because of that your reported problem arise. To overcome this problem, we need to set the property after updating the dataSource.  

Query #2:- If i set datasource before i set the sortSettings, double ajax request will be sent (want to avoid this) 

 

When we set dataSource before setting the sortSettings,  it will  send post for two times which is the default behavior while on updating dataSource and also for sortSettings.  To overcome this problem we have pass the query for sorting the Grid along with ejDataManager and also need to update the model of the sortSettings as like below code example:- 

    var dataManger = ej.DataManager({ 

            url: "/Home/DataSource", 

            insertUrl: "/Home/Insert", 

            updateUrl: "/Home/Update", 

            removeUrl: "/Home/Delete", 

            adaptor: "UrlAdaptor" 

        }); 

         

 

        $(function () { 

             $("#Grid").ejGrid({ 

                 dataSource: [], 

                 

               .   .    .         

            }); 

        }); 

 

    </script> 

    <script type="text/javascript"> 

        function refreshData() { 

            var grid = $('#Grid').ejGrid('instance'); 

            grid.option({ 

                dataSource: dataManger, 

                query: ej.Query().sortBy("EmployeeID", ej.sortOrder.Descending, false) 

            }); 

           grid.model.sortSettings.sortedColumns.push({field: "EmployeeID", direction: "descending" }) 

       } 

        

     </script> 

Refer to the documentation Link:- 

https://help.syncfusion.com/js/datamanager/sorting 

Please get back to us if you need any futher details. 

Regards, 

Farveen sulthana T