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

How to programmatically get/set sort in a GridControl

Is there a way to determine which column a grid is being sorted by, after the user clicks on a column header, and in which order, ascending or descending, the grid is sorted? I mean this for a regular GridControl with values set manually into the cells, not with a databound grid.

Also, if this information can be retrieved, can you programatically sort a grid using this information?


4 Replies

SR SubhaSheela R Syncfusion Team May 10, 2008 10:17 AM UTC

Hi Don,

Thanks for your interest in Syncfusion products.

You can sort programmatically in our Grid Control. Kindly refer to our shipped browser sample for more details.

Here is browser sample path:

{InstallationDrive}\Documents and Settings\{UserName}\My Documents\Syncfusion\EssentialStudio\6.1.0.34\Windows\Grid.Windows\Samples\2.0\FeatureSamples\GridControlSort

Please let me know if it helps.

Regards,
Subhasheela R




MS Maxim Software Systems May 12, 2008 01:08 PM UTC

Yes, this helps. Thanks!



JH Jimmy Hales July 29, 2016 12:23 AM UTC

Is there a way to "get" the current sort status of an ejGrid? I'd like to find out which column is sorted and how for persistence purposes.


SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team July 29, 2016 11:37 AM UTC

Hi Maxim, 

We could see you would like to collect the sorted columns and their sort the direction. You can collect those information using either events/Grid APIs. actionComplete/actionBegin events of the Grid will provide the sorting column names and their direction while sorting the corresponding column. sortSettings->sortedColumns of the Grid also provide the collection of the sorted columns with their direction. In the following code example, we have explained the way to collect the sorted columns in the mentioned events as well as the sortedColumns API. 
 
    <!--click the button after sorting the column--> 
    <button id="btn"></button> 
    <div id="Grid"></div> 
    <script type="text/javascript"> 
        $(function () { 
            $("#Grid").ejGrid({ 
                dataSource: window.gridData, 
                allowPaging: true, 
                allowSorting: true, 
                actionComplete: function (args) {//after completing the sorting action 
                    if (args.requestType == "sorting") { 
                        console.log(args.columnName); 
                        console.log(args.columnSortDirection); 
                    } 
                }, 
                actionBegin: function (args) {//at the begining of sorting action 
                    if (args.requestType == "sorting") { 
                        console.log(args.columnName); 
                        console.log(args.columnSortDirection); 
                    } 
                }, 
        .  .  . . . .  
            }); 
            $("#btn").ejButton({ 
                text: "Get Sort", 
                click: function (args) { 
                    var obj = $("#Grid").ejGrid("instance"); 
                    console.log(obj.model.sortSettings.sortedColumns); 
                } 
            }) 
        }); 
    </script> 

We have prepared a sample that can be referred from the following jsPlayground. 


Refer to the following Help Documents. 


You have quoted that you would like to find out the columns for persistence purpose. By default, ejGrid provides the option to maintain the state of the Grid. To enable the persistence state and maintain the previously applied actions on Grid even after refreshing the page, enable the enablePersistence API of the Grid. Refer to the following code example and Help Documents. 

 
    <div id="Grid"></div> 
    <script type="text/javascript"> 
        $(function () { 
            $("#Grid").ejGrid({ 
                dataSource: window.gridData, 
                allowPaging: true, 
                allowSorting: true, 
                enablePersistence: true, 
                 . . . . 
            }); 
        }); 
    </script> 


Refer the online demo on enablePersistence. 
  

Regards, 
Seeni Sakthi Kumar S. 


Loader.
Up arrow icon