muak
muak

Reputation: 199

Are Groups can be sorted other than alphabetically in JqGrid

I'm getting response from server that gives data in grouping in a specific order. But when I load that data in my jqGrid it automatically sort groups in alphabetically order, and I want the order in which server provided me data.

For example I'm getting data in three groups i-e university , college , school

Now this can be sorted as increasing order i-e college , school , university

Or

Can be sorted as decreasing order i-e university , school , college

What should I do so that the order will remain in the same order as I'm getting it back from server?

I want to make some addition the response of server is stored in an object and then I load that data in a grid so I guess its local data... Sorry I'm new to jqGrid

Here is my code for jqgrid.

GRID = $("#"+GRID_ID).jqGrid({
            url: sample,
            datatype: 'json',
            jsonReader : {
                        root:"rows",
                        page: "page",
                        total: "total",
                        records: "records",
                        //repeatitems: false,
                    },
            colNames: ['File', 'UID', 'Order', 'Type', 'Project','Method', 'Phase' , 'Group'],
            colModel: [{
                name: 'file',
                index: 'file',
                width: 140
            }, {
                name: 'uid',
                index: 'uid',
                width: 80
            }, {
                name: 'order',
                index: 'order',
                width: 60,
                sortable:true

            }, {
                name: 'type',
                index: 'type',
                width: 75,
                editable:true,
                edittype:"select",
                editrules: { required: true }
            }, {
                name: 'project',
                index: 'project',
                width: 100,
                editable:true,
                edittype:"select",
                editrules: { required: true }
            }, {
                name: 'method',
                index: 'method',
                width: 60,
                editable:true,
                edittype: "select",
                editrules: { required: true }, 
                //editoptions: { size: 71}
            },{
                name: 'phase',
                index: 'phase',
                width: 75,
                editable:true,
                edittype:"select",
                editrules: { required: true }
            },{
                name: 'group',
                index: 'group',
                width: 75,
                sortable: false,
                hidden:false
            }],
            loadComplete: function() {

                $("#"+GRID_ID).setColProp('type', { editoptions: { value: types} });
                $("#"+GRID_ID).setColProp('project', { editoptions: { value: project} });


            },
            //rowNum: 10,
            autowidth: true,
            rowList: [10, 50, 100],
            pager: $("#"+PAGER_ID),
            loadonce: true,
            sortname: 'order',
            viewrecords: true,
            sortOrder: "asc",
            multiSort: false,
            pgbuttons: true,
            pginput: true,          
            cellEdit: true, 

            cellsubmit : 'clientArray',
            editurl: 'clientArray',
            height: "100%",
            toolbar: [true, "bottom"],
            grouping:true,
            groupingView : { 
                groupField : ['group'],
                groupDataSorted : true,
                groupSorted:false,
                groupColumnShow:[true],
                sortable:false 
            },
            caption: 'JqGrid Examples'
        }).navGrid("#"+PAGER_ID, {
            edit: false,
            add: false,
            del: false
        });

Upvotes: 1

Views: 541

Answers (1)

Yugandhar
Yugandhar

Reputation: 365

I have also had same problem. i have solved like below.

1) Added index filed in the row

2) provided order(like 1,2,3....) for each row on server side

3) And settings in JQGrid

        loadonce: false,
        altRows: true,
        sortname: 'index',     /* this filed */
        sortorder: "asc",       /* this filed */
        grouping: true,
        groupingView: {
            groupField: ['group'],
            groupColumnShow: [false],
            groupCollapse: true,
            groupSorted: false,     /* this filed */
            groupDataSorted: true  /* this filed */
        },

with All 4 /* this filed*/ values , we can achive this.

Suppose in your case groups(elements in group ) like university(a,b) , college(x,y,z) , school(p,q,r,s,t).

Then on server side. (index, elment) (1,a),(2,b),(3,x),(4,y),.....(10,t). Try this ,if didnt work let know. Thanx.

Upvotes: 1

Related Questions