Grouping not working in multiple tab grids

QuestionsGrouping not working in multiple tab grids
Anita Yadav asked 3 years ago

Hi Team,

I have implemented multiple grids under multiple tabs and also implemented code for dynamic grouping for each grids in tabs like below, but somehow the grouping is not working properly.
If I am using grouping in one grid under one tab, then it filters the records from all other grids under other tabs also. And grouping columns are shown on all other tabs also.

Please suggest me any idea, that can be help in making groupings dynamically, according the grids under each tabs.

Please find my attached code for grouping in view part:-

//code to get the grid id from the every tabs
var current_grid1 = $(this).attr(‘data-tab-no’);
var current_grid2 = $(‘.djtabs-in div[data-tab-no=”‘+current_grid1+'”]’).find(‘.djtabs-article-content div’).attr(‘id’);
var gridName = current_grid2.split(‘master_grid’);

//code to initialize the grid id
var $grid = $(“#”+gridName[1]+””);
var gridGroupName = “grid_groups_”+gridName[1];

getColumnHeaderByName = function (colName) {
var $self = $(this),
colNames = $self.jqGrid(“getGridParam”, “colNames”),
colModel = $self.jqGrid(“getGridParam”, “colModel”),
cColumns = colModel.length,
iCol;
for (iCol = 0; iCol < cColumns; iCol++) {
if (colModel[iCol].name === colName) {
return colNames[iCol];
}
}
},
customFormatDisplayField = function (displayValue, value, colModel, index, grp) {
return getColumnHeaderByName.call(this, colModel.name) + “: ” + displayValue;
},
generateGroupingOptions = function (groupingCount) {
var i, arr = [];
for (i = 0; i < groupingCount; i++) {
arr.push(customFormatDisplayField);
}
return {
formatDisplayField: arr
}
},
getArrayOfNamesOfGroupingColumns = function () {
return $(“#”+gridGroupName+” ol li:not(.placeholder)”)
.map(function() {
return $(this).attr(“data-column”);
}).get()
};

$(“tr.ui-jqgrid-labels th div”).draggable({
appendTo: “body”,
helper: function( event ) {
return $( “<div class=’dragable’>”+$(this).html()+”</div>” );
}
});

if($(“#”+gridGroupName+” ol li”).length==0){
$(“#”+gridGroupName+” ol”).append(“<li class=’placeholder’><?php echo JText::_(‘MOD_MERCURY_TABERD_GRIDPHPCONFIG_LABEL_GROUPING’); ?></li>”);
}

$(“#”+gridGroupName+” ol”).droppable({
activeClass: “ui-state-default”,
hoverClass: “ui-state-hover”,
accept: “:not(.ui-sortable-helper)”,
drop: function(event, ui) {
var $this = $(this), groupingNames;
$this.find(“.placeholder”).remove();
var groupingColumn = $(“<li></li>”).attr(“data-column”, ui.draggable.attr(“id”).replace(“jqgh_” + $grid[0].id + “_”, “”));

$(“<span class=’ui-icon ui-icon-close’></span>”).click(function() {
var namesOfGroupingColumns;
$(this).parent().remove();
$grid.jqGrid(“groupingRemove”);
namesOfGroupingColumns = getArrayOfNamesOfGroupingColumns();
$grid.jqGrid(“groupingGroupBy”, namesOfGroupingColumns);
if (namesOfGroupingColumns.length === 0) {
$(“<li class=’placeholder’><?php echo JText::_(‘MOD_MERCURY_TABERD_GRIDPHPCONFIG_LABEL_GROUPING1’); ?></li>”).appendTo($this);
}
}).appendTo(groupingColumn);
groupingColumn.append(ui.draggable.text());
groupingColumn.appendTo($this);
$grid.jqGrid(“groupingRemove”);
groupingNames = getArrayOfNamesOfGroupingColumns();
$grid.jqGrid(“groupingGroupBy”, groupingNames, generateGroupingOptions(groupingNames.length));
jQuery(“.chngroup”).val(“clear”);
}
}).sortable({
items: “li:not(.placeholder)”,
sort: function() {
$( this ).removeClass(“ui-state-default”);
},
stop: function() {
var groupingNames = getArrayOfNamesOfGroupingColumns();
$grid.jqGrid(“groupingRemove”);
$grid.jqGrid(“groupingGroupBy”, groupingNames, generateGroupingOptions(groupingNames.length));
}
});

 

Thanks in advance.

3 Answers
Abu answered 3 years ago

Hi,

I reviewed your code but unable to understand the issue by this.
You can email me code and screenshot on my email [email protected]

And if this does not solve, remote desktop session might also be required so you can join me on hangouts and tell your working hours and time zone to plan accordingly.

anita yadav answered 3 years ago

Hi Abu,

Can we connect through hangouts at 11:00pm on 6th Jan 2021 ?

I am available. Can you share the invite me at [email protected]?

anita yadav answered 3 years ago

Hi Abu, Can we connect through hangouts at 11:15pm on 6th Jan 2021 as per Indian time ? I am available. Can you share the invite me at [email protected]?

Your Answer

7 + 7 =

Login with your Social Id:

OR, enter

Attach code here and paste link in question.
Attach screenshot here and paste link in question.



How useful was this discussion?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate it.

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?