Hello Pankaj,

Thank you for posting in our community.

My suggestion for achieving your requirement is handling groupedColumnsChanging event which is fired when the grouped columns collection is about to change. This event can be canceled which will prevent grouping 

There are two options:

• Check the count of the currently grouped columns and if it exceeds the limit to cancel grouping by returning false.

 groupedColumnsChanging: function (evt, ui) { 
								var groupedColumnsCount =  ui.groupedColumns.length;
								if(groupedColumnsCount > 2) { 
									alert("Maximum size of grouped columns is 3. Grouping column " + ui.key + " is going to be prevented");
									return false
								}
						 }

• Check the count of the grouped columns and if it exceeds the limit to ungroup lastly grouped column and group the current one.

groupedColumnsChanging: function (evt, ui) { 
								var groupedColumnsCount =  ui.groupedColumns.length;
								if(groupedColumnsCount > 2 && groupedColumnsCount > 1) { 
									alert("Maximum size of grouped columns is 3. Column " +  ui.groupedColumns[groupedColumnsCount - 1].col.headerText + " is going to be ungrouped and column " + ui.key + " is going to be grouped");
									$("#grid").igGridGroupBy("ungroupByColumn", ui.groupedColumns[groupedColumnsCount - 1].key);
								}
						 }

Attached you will find a sample illustrating the second approach. Please test it on your side and let me know if you have any additional questions regarding this matter.

7713.igGridGroupOnly3Columns.zip

Hello  Vasya ,

        Thank u very much first one worked for me..

         may be 2nd one is some version issue of my product... once again thank u so much it help other also...

Thanks,

Pankaj Bahukhandi

Hello Vasya,

   Its working on when user drag column and place grouping area but not working on when user click select column and then select multiple column and appy grouping so can u provide me solution for this scenerio...

Thanks,

Pankaj Bahukhandi

When grouping columns from the grouping dialog different events are triggered. In order to achieve the same behavior the modalDialogGroupingColumn event, fired when column in the modal dialog is clicked to be grouped, should be handled as well. For example:

 modalDialogGroupingColumn: function(evt, ui){
							var tmpGroupedCol = ui.owner._tempGroupedColumns.length;
							if( tmpGroupedCol > 2 ){
								return false;
							}
						 }

Please let me know if you have any additional questions.

0550.igGridGroupOnly3Columns (2).zip

Remote Paging does not work as expected with remote GroupBy. We have this listed in our Known Issues topic available here. Please have a look at this document and if your scenario is not matching any of the listed please feel free to get back to me with more details.

Hello Vasya,

can you solved my one more issue...

When I am using Paging the group by only used on single page.. I mean Group By Not worked on Paging type remote....

Thanks,

Pankaj Bahukhandi

Thanku  Vasya,

   Your suggestion helpful for me...

 below is my code...

groupedColumnsChanging: function (evt, ui) {
debugger;
var groupedColumnsCount = ui.groupedColumns.length;
if (ui.triggeredBy == 'modalDialog') {
var newSize = ui.newGroupedColumns.columns.length;
if (newSize > 4) {
alert("Please Check, You can group on maximum 4 columns.");
return false;
}
} else {
if (groupedColumnsCount > 3 && (ui.triggeredBy == 'dragAndDrop')) {
alert("Please Check, You can group on maximum 4 columns.");
return false;
}
}
},