JQGRID: Add sort option in the grid for all column

Question

I need to add sort option in the grid for all column ('Incident key','Date','State','Incident no','FF death', 'OTH death','Property Loss','Cont Loss','Fire Cause') separately. I tried but its not working, please do fix sorting in my code and answer if you have some idea on it.

  showLoading();
        $("#list1").jqGrid({
            type: 'POST',
            url: 'include/LocationService.php?run=gridForCongressionalDistrict&address='+$('#address').val()+'&radius='+$('#radius').val()+'&query='+encodeURIComponent(query_condition),
            datatype: 'json',
            colNames:['Incident key','Date','State','Incident no','FF death', 'OTH death','Property Loss','Cont Loss','Fire Cause'],
            colModel :[ 
            {
                name:'a.INC_KEY', 
                index:'a.INC_KEY',
                width: 220,
               hidden: true,
                editrules: {
                   edithidden:true
               },
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }
            }, 

            {
                name:'a.INC_DATE', 
                index:'a.INC_DATE',
                width: 100,
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }
            }, 

            {
                name:'a.INC_NO', 
                index:'a.INC_NO',
                width: 100,
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }

            }, 

            {
                name:'a.STATE', 
                index:'a.STATE',
                width: 100,
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }
            }, 

            {
                name:'a.FF_DEATH', 
                index:'a.FF_DEATH',
                width: 80,
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }
            }, 

            {
                name:'a.OTH_DEATH', 
                index:'a.OTH_DEATH',
                width:80,
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }
            },

            {
                name:'a.PROP_LOSS', 
                index:'a.PROP_LOSS',
                width: 80,
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }
            },

            {
                name:'a.CONT_LOSS', 
                index:'a.CONT_LOSS',
                width: 80,
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }
            },

            {
                name:'a.CAUSE_CODE_DESC', 
                index:'a.CAUSE_CODE_DESC',
                width: 240,
                searchoptions: {
                    sopt: ['eq', 'ne','cn']
                }
            },
            ],
            pager: '#pager',
            rowNum: 500,
            rowList:[500,100,20],
            sortname: 'INC_KEY',
            sortorder: 'desc',
            viewrecords: true,
            height: 400,
            width: 800, 
            shrinkToFit: false,
            gridview: true,
            caption: 'Reports',
            loadComplete: function(data){
                console.log('load complete'); 
                pin_data = data;
                viewReset = 'true';
                onSuccessFunction(data,'true');
            }
        });
        jQuery("#list1").jqGrid('navGrid','#pager',{
            edit:false,
            add:false,
            del:false
        });

        jQuery("#list1").jqGrid("clearGridData", true).setGridParam({
            url : 'include/LocationService.php?run=gridForCongressionalDistrict&address='+$('#address').val()+'&radius='+$('#radius').val()+'&query'+encodeURIComponent(query_condition),
            loadComplete: function(data){
                console.log('load complete');
                onSuccessFunction(data, 'true');  
            }
        }).trigger("reloadGrid")

        $("#error").html('<div class="error1"></div>');

    }
}  
)
})

score 1 · Answer 1 · edited May 23 '17 at 12:18

First of all the answer on your main question: you can use cmTemplate option (see the answer for details) which can be used to change default settings of all columns in colModel. For example,

cmTemplate: { searchoptions: { sopt: ['eq', 'ne','cn'] } }

Additionally I recommend you to move information about parameters from URL to postData. So

url: 'include/LocationService.php?run=gridForCongressionalDistrict&address=' +
        $('#address').val() + '&radius=' + $('#radius').val() +
        '&query=' + encodeURIComponent(query_condition),

to

url: 'include/LocationService.php',
postData: {
    run: 'gridForCongressionalDistrict',
    address: function () {
        return $('#address').val();
    },
    radius: function () {
        return $('#radius').val();
    },
    query: query_condition
}

In the case the values address and radius will be recalculated on every request to the server and you will have current values of $('#address').val() and $('#radius').val() sent to the server.

score 0 · Accepted Answer · answered Oct 15 '12 at 11:27

{

searchoptions: { sopt: ['eq', 'ne','cn'] } }

url: 'include:yoursphp page.php?run=yoursfunctionsname&yoursaddingfunctions name=' +
        $('#yours varianle name').val() + sort=' + $('variable name').val() +
        '&query=' + encodeURIComponent(query_condition),

url name:"";

post data
{
}
return result():

or using the sort query sort the things and parse the values in jgrid.

JQGRID: Add sort option in the grid for all column

2 Answers2