jqueryjqgrid

How do i sort children under each group of JQGrid in its group header row mode?


i have used the Trirand JQGrid 4.6 to generate group header row JQGrid.

i have extract the code from the demo website:

As you can see the Date column is sorted in the ascending order on page load. So all the children of each group is sorted in ascending of date. But how do i force this column to be sorted in the descending order at page load so the children will be sorted in the descrnding order of the date?

  1. How to make the grid stop the sorting of Inv No column?

enter image description here

jQuery("#list483").jqGrid({
    data: mydata,
    datatype: "local",
    height: 'auto',
    rowNum: 30,
    rowList: [10,20,30],
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    colModel:[
        {name:'id',index:'id', width:60, sorttype:"int"},
        {name:'invdate',index:'invdate', width:90, sorttype:"date", formatter:"date"},
        {name:'name',index:'name', width:100, editable:true},
        {name:'amount',index:'amount', width:80, align:"right",sorttype:"float", formatter:"number", editable:true},
        {name:'tax',index:'tax', width:80, align:"right",sorttype:"float", editable:true},      
        {name:'total',index:'total', width:80,align:"right",sorttype:"float"},      
        {name:'note',index:'note', width:150, sortable:false}       
    ],
    pager: "#plist483",
    viewrecords: true,
    sortname: 'name',
    grouping:true,
    groupingView : {
        groupField : ['name'],
        groupColumnShow : [false],
        groupText : ['<b>{0} - {1} Item(s)</b>']
    },
    caption: "Configure group header row"
});

EXTENDED POST:

enter image description here

i have extended the conversation in the post. Assume this scenario. data is coming from DB stored procedure and stored procedure comes data in a certain row order (see image) and i want to use exactly that order as it is in the grid.

As shown on the attachment assume i have simplified the dataset you use in demosite to the one the attached image where i use only use three columns Name, Date, Amount. as you can see on the image there are four records and there are two groups of Names and their Dates. Assume i need to use exact order of the records as shown on image on grid too. another words use the order of rows in the stored procedure in the grid too. which i have to turn off the default sorting etc of the grid. How do i acheive this?

So the end result should be like this:

     Test1
          12/12/2012         12000
           10/4/2012           2000 
Test2
            1/1/2013            300000
             7/24/2016         46000

Solution

  • I think that your code don't correspond the picture. You use probably sortname: "invdate".

    To change the order of sorting by invdate you need add the option sortorder: "desc".

    If you need to change the order of the grouped data (the name, because you use groupField : ["name"]) you cab add groupOrder property to groupingView. For example

    groupingView: {
        groupField: ["name"],
        groupOrder: ["desc"], // "asc" is by default
        groupColumnShow: [false],
        groupText: ["<b>{0} - {1} Item(s)</b>"]
    }