Guriddo » Topic: The “subGridRowExpanded” event returns the wrong row ID.

The “subGridRowExpanded” event returns the wrong row ID.

Guriddo
#collapseSubGridRow, Subgrid, subgridrowexpanded
The “subGridRowExpanded” event returns the wrong row ID.

Tagged: #collapseSubGridRow, Subgrid, subgridrowexpanded

This topic has 3 replies, 2 voices, and was last updated 2 years, 9 months ago by guriddo.support.

Creator

Topic
March 31, 2023 at 5:59 pm #128152

saravanan0905
Participant

The “subGridRowExpanded” event returns the wrong row ID if the grid row was collapsed using the “collapseSubGridRow” method.
Creator

Topic

Viewing 3 replies - 1 through 3 (of 3 total)

Author

Replies

April 3, 2023 at 9:30 am #128153

guriddo.support

Participant

Hello,

Such kind of description of the problem will not help you.

In order to get quality support you will need to prepare a working test case.

You can publish it here, send it to support team or prepare online version.

Please note the phrase – working test case

Kind Regards,

Will

Guriddo Support Team

April 5, 2023 at 5:09 pm #128154

saravanan0905

Participant

The aim is to close an already expanded row when a new row expands.
Step to reproduce the issue.
Step1: Exapand any row.
Step2: Now expand any other row, the value “id” from “subGridRowExpanded” event got the incorrect row id.

var last_expanded_row_id;
$(&quot;#grid&quot;).jqGrid({
datatype: &#039;local&#039;,
data: myGridData,
colNames: [&#039;Column 1&#039;, &#039;Column 2&#039;],
colModel: [
{ name: &#039;col1&#039;, width: 200 },
{ name: &#039;col2&#039;, width: 200 }
],
...
subGrid: true,
subGridBeforeExpand: function(pID, id) {
if(last_expanded_row_id !== undefined) {
$(&quot;#grid&quot;).collapseSubGridRow(last_expanded_row_id);
}
},
subGridRowExpanded: function (pID, id) {
//here id receives incorrect row id.
$(&quot;#&quot;+pID).html(pID+ &quot;_t&quot;);
$(&quot;#&quot;+pID+&quot;_t&quot;).jqGrid({
datatype: &#039;local&#039;,
data: mySubgrids[id],
colNames: [&#039;Col 1&#039;, &#039;Col 2&#039;, &#039;Col 3&#039;],
colModel: [
{ name: &#039;c1&#039;, width: 100 },
{ name: &#039;c2&#039;, width: 100 },
{ name: &#039;c3&#039;, width: 100 }
],
...
});
last_expanded_row_id = id;
}
});

var last_expanded_row_id;

$("#grid").jqGrid({

datatype: 'local',

data: myGridData,

colNames: ['Column 1', 'Column 2'],

colModel: [

{ name: 'col1', width: 200 },

{ name: 'col2', width: 200 }

...

subGrid: true,

subGridBeforeExpand: function(pID, id) {

if(last_expanded_row_id !== undefined) {

$("#grid").collapseSubGridRow(last_expanded_row_id);

}

subGridRowExpanded: function (pID, id) {

//here id receives incorrect row id.

$("#"+pID).html(pID+ "_t");

$("#"+pID+"_t").jqGrid({

datatype: 'local',

data: mySubgrids[id],

colNames: ['Col 1', 'Col 2', 'Col 3'],

colModel: [

{ name: 'c1', width: 100 },

{ name: 'c2', width: 100 },

{ name: 'c3', width: 100 }

...

});

last_expanded_row_id = id;

}

});

This reply was modified 2 years, 9 months ago by saravanan0905.
This reply was modified 2 years, 9 months ago by saravanan0905.

April 7, 2023 at 10:37 am #128158

guriddo.support

Participant

Hello,

Thank you for the test case. It is much easier to solve this way the problem.

The problem appear in subGridBeforeExpandRow which triggers a click which actually forces the expandGridRow (Catch 22)

To solve the problem use the following trick:


		$("#grid").jqGrid({
			datatype: 'local',
			data: myGridData,
			colNames: ['id','Column 1', 'Column 2'],
			colModel: [
				{ name: 'id', hidden: true, key: true},
				{ name: 'col1', width: 200 },
				{ name: 'col2', width: 200 }
			],
			subGrid: true,
			height: 400,
			subGridBeforeExpand: function(pID, id) {
				if(last_expanded_row_id !== undefined) {
					setTimeout(function() {
						$("#grid").collapseSubGridRow(last_expanded_row_id);
					}, 50);
				}
			},
			subGridRowExpanded: function (pID, id) {
	            var childGridID = pID + "_table";
		        var childGridPagerID = pID + "_pager";
	            $('#' + pID).append('<table id=' + childGridID + '></table><div id=' + childGridPagerID + ' class=scroll></div>');
				$("#" + childGridID).jqGrid({
					datatype: 'local',
					data: mySubgrids[id],
					colNames: ['Col 1', 'Col 2', 'Col 3'],
					colModel: [
						{ name: 'c1', width: 100 },
						{ name: 'c2', width: 100 },
						{ name: 'c3', width: 100 }
					],
					gridComplete : function() {
						setTimeout(function() { last_expanded_row_id = id;},1000);
					}
				});
			}
		});

$("#grid").jqGrid({

datatype: 'local',

data: myGridData,

colNames: ['id','Column 1', 'Column 2'],

colModel: [

{ name: 'id', hidden: true, key: true},

{ name: 'col1', width: 200 },

{ name: 'col2', width: 200 }

subGrid: true,

height: 400,

subGridBeforeExpand: function(pID, id) {

if(last_expanded_row_id !== undefined) {

setTimeout(function() {

$("#grid").collapseSubGridRow(last_expanded_row_id);

}, 50);

}

subGridRowExpanded: function (pID, id) {

var childGridID = pID + "_table";

var childGridPagerID = pID + "_pager";

$('#' + pID).append('<table id=' + childGridID + '></table><div id=' + childGridPagerID + ' class=scroll></div>');

$("#" + childGridID).jqGrid({

datatype: 'local',

data: mySubgrids[id],

colNames: ['Col 1', 'Col 2', 'Col 3'],

colModel: [

{ name: 'c1', width: 100 },

{ name: 'c2', width: 100 },

{ name: 'c3', width: 100 }

gridComplete : function() {

setTimeout(function() { last_expanded_row_id = id;},1000);

}

});

}

});

Guriddo Support Team

Author

Replies

Viewing 3 replies - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

Stay connected with us in your favorite flavor!

The “subGridRowExpanded” event returns the wrong row ID.

Search Forum

Recent Replies

Forum Statistics

UserOnline