Thanks for your suggestion.

If I understand correctly, you mean that the index position of the column will be used to decide if the sort needs to be reset or not, assuming that colum on the left are "more important" than the one on the right.

In my case a sort on the last column on the right then on the first column on the left will be an interesting sort for the user so I can't do that.

Regards

Another possible solution is to analyze the sort.

This can be something like this.

The user click a column to sort.

The user click another column to sort - if this column is with higher index (from colModel - NOT index property) the sort is added if not the sort is reset automatically and the begin to sort from this index.

I hope you got the idea.

Kind Regads

For the moment, I click on a link which points on the same page and so reload the page which causes the javascript global variable to be reset.

But I have seen there is a concept of toolbar in jqGrid ( I guess it is the icons at the bottom left of the grid), so I will try to add an icon there which would have as purpose to clean the global variables.

Regards,

Christophe

Good beginning.

How we can destroy the sort in order to begin new one?

Regards

Since it looks like jqGrid is not supporting multi-column sorting natively, I have tried to implement a custom sort which is acting like a multi-column sorting on my json data.

Since I'm new to jqGrid, I post it here, so anyone can feel free to comment and give feedback about this way to do it.

Anyway, it's far from perfect since the sort icon are not synchronized with the actual sorting ( only one arrow in one column is 'selected' ), but at least it gives a way to sort on more than one column.

Thanks in advance for your feedback on the below code.

Best regards,

Christophe

Step 1)

declaring two global variables which will contain the information about the sorting:

// this array contains the ordered list of index name in which the sorting has to be applied

var vmOverviewTableSortingOrderedList = new Array();

// this associative array contains the association index name => order

var vmOverviewTableSortingHash = new Array();

Step 2)

declaring a global method which will update the two global variables on each sorting request from the user

function updateVmOverviewTableSorting(propertyName, order)
{

    // remove the index name from the ordered list, whatever its position, it will be removed
    vmOverviewTableSortingOrderedList
        = jQuery.grep(vmOverviewTableSortingOrderedList, function(value) {
            return value != propertyName;
        });

    // add the index name as first element in the ordered list
    vmOverviewTableSortingOrderedList.unshift(propertyName);

    // add or update the association index name => order   
    vmOverviewTableSortingHash[propertyName] = order;
}

Step 3)

Defines two url parameters which will be used to send the sorting information to the server:

- 'sortnames' which is an index name comma-separated list

- 'sortorders' for the order list

Below is the initial url defining an initial sorting on the index name 'name' in ascending order 'asc'

jQuery("#vmOverviewTable").jqGrid({
    url : 'vmOverviews?sortnames=name&sortorders=asc',
    datatype : "json",

Step 4)

Defining a onSortCol function which updates the global variables and the url:

    onSortCol: function (index, columnIndex, sortOrder) {
        // update the two global variables
        updateVmOverviewTableSorting(index, sortOrder);

        // creates the two comma-separated list (one for the index name, the other for the order)

        // from the data in the two global variables
        var sortPropertyNames = '';
        var sortOrders = '';

        
        $.each(vmOverviewTableSortingOrderedList, function(index, value) {
            if (sortPropertyNames.length != 0)
            {
                sortPropertyNames += ',';
                sortOrders += ',';
            }
            
            sortPropertyNames += value;
            sortOrders += vmOverviewTableSortingHash[value];
        });

        // change the url with the two url parameters changed with the new comma-separated list
        var url = 'vmOverviews?sortnames='+sortPropertyNames+'&sortorders='+sortOrders;
        
        $("#vmOverviewTable").jqGrid('setGridParam',{'url':url});

        // we DON'T return "stop" here, so the default sorting process code is executed (such calling the url in ajax)
        return '';
    }

Step 5)

I don't provide the code here, but the final step is to handle the parameters in the server-side controller in order to implement the sorting on the server side.

For example, my Symfony2 action is starting like this:

     /**
     * @Route("/vmOverviews", name="_paas_vmOverviews", defaults={"_format"="json"})
     * @Template()
     */
    public function vmOverviewsAction()
    {
        
        $request = $this->getRequest();
        
        $sortnames = $request->query->get('sortnames');
        $sortorders = $request->query->get('sortorders');