How to make jQuery Grid with grouping multiple column - PHP ?

Question

How could I generate a jquery grid with grouping on multiple columns?

The below is the code I am using and I need to group the grid with multiple column names. Currently it is being grouped with a single column.

The select menu for the columns names are coming in drop down menu.

This is the jQuery code for grouping the grid using the selected menu item:

<script>
        jQuery("#chngroup").change(function()
        {
            var vl = jQuery(this).val(); 
            if(vl) 
            { 
                if(vl == "clear") 
                    jQuery("#<?php echo $grid_id ?>").jqGrid('groupingRemove',true); 
                else 
                    jQuery("#<?php echo $grid_id ?>").jqGrid('groupingGroupBy',vl); 
            } 
        });
</script>

this is a question. I wanted to know the process of developing a code for multiple grid with jquery!! — Harsimran Singh
Well, nobody would give an exact step-by-step instruction; you should tell us, what is your problem during that process. — feeela
actually i am using a grid with grouping on a single column at a time and instead that i need to have multiple columns to be grouped on. — Harsimran Singh

tpeczek tpeczek · Accepted Answer · 2012-09-11T09:51:02

To group on multiple columns, you need to pass all the columns names to the groupingGroupBy method as an array (the first value in the array is the first level, the second value is the second level and etc.).

For example lets say that you want to group first by name and then date columns:

 jQuery("#grid_id").jqGrid('groupingGroupBy', ['name', 'date']);

This should do the trick. You can pass all the other groupingView options in an additional parameter (as na object which will be used to extend default groupingView).

UPDATE

I have created a live example on jsFiddle -> jqGrid multigrouping with 'groupingGroupBy' method

How to make jQuery Grid with grouping multiple column - PHP ?

1 Answers