From 5e90d21f81c61214a22ac7c7aef46def570ba556 Mon Sep 17 00:00:00 2001
From: jerrybrown5 <jerrybrown5@users.noreply.github.com>
Date: Sat, 19 Sep 2020 22:53:19 -0400
Subject: [PATCH 1/2] Update dataTables.rowGroup.js

- fix: allow startRender and EndRender to have multiple columns without interfering with Responsive
     + mimic display of corresponding header columns
     + leave unchanged logic when there is only one td
- fix: dont wrap a tr > td around a tr

- not addressed: not checking colspans and not populating colspan of last td when there are more than one td and number of tds is less than visible responsive cols
---
 js/dataTables.rowGroup.js | 36 ++++++++++++++++++++++++++++++++----
 1 file changed, 32 insertions(+), 4 deletions(-)

diff --git a/js/dataTables.rowGroup.js b/js/dataTables.rowGroup.js
index 759cabd..187ceea 100644
--- a/js/dataTables.rowGroup.js
+++ b/js/dataTables.rowGroup.js
@@ -175,13 +175,25 @@ $.extend( RowGroup.prototype, {
 	 */
 
 	/**
-	 * Adjust column span when column visibility changes
+	 * Adjust column span or hiding cells when column visibility changes
 	 * @private
 	 */
 	_adjustColspan: function ()
 	{
-		$( 'tr.'+this.c.className, this.s.dt.table().body() ).find('td:visible')
-			.attr( 'colspan', this._colspan() );
+		var dt = this.s.dt;
+
+		$( 'tr.'+this.c.className, this.s.dt.table().body() ).each( function ( undefined, tr ) {
+			var tds = $(tr).children();
+			if ( tds.length === 1 ){
+				tds.attr( 'colspan', this._colspan());
+			}
+			else if ( tds.length > 1 ){
+				tds.each( function ( i, td ) {					
+					$(td).css('display', $(dt.column(i).header()).css('display'));//mimic the display val of the header
+				});
+			}
+		});
+		
 	},
 
 	/**
@@ -342,8 +354,24 @@ $.extend( RowGroup.prototype, {
 						.attr( 'colspan', this._colspan() )
 						.append( display  )
 				);
-		}
+			
+			var displayTr = row.find('> td > tr');
 
+			if ( displayTr.length ){//dont wrap tr td around a tr
+				row = $(displayTr[0]);
+			}			
+		}
+		
+		var tds = $(row).children();
+		if ( tds.length === 1 ){
+			tds.attr( 'colspan', this._colspan());
+		}
+		else if ( tds.length > 1 ){
+			tds.each( function ( i, td ) {
+				$(td).css('display', $(dt.column(i).header()).css('display'));//mimic the display val of the header
+			});
+		}
+		
 		return row
 			.addClass( this.c.className )
 			.addClass( className )

From 573839fd5ac4f2a61ea28ff613cacfbb0a9958d4 Mon Sep 17 00:00:00 2001
From: jerrybrown5 <jerrybrown5@users.noreply.github.com>
Date: Sat, 19 Sep 2020 23:07:15 -0400
Subject: [PATCH 2/2] Responsive startRender and EndRender with multiple TDs

- fix: allow startRender and EndRender to have multiple columns playing more nicely with Responsive
     + mimic display of corresponding header columns
     + leave unchanged logic when there is only one td
- fix: dont wrap a tr > td around a tr

- not addressed: not checking colspans and not populating colspan of last td when there are more than one td and number of tds is less than visible responsive cols
---
 js/dataTables.rowGroup.js | 18 +++++++++++-------
 1 file changed, 11 insertions(+), 7 deletions(-)

diff --git a/js/dataTables.rowGroup.js b/js/dataTables.rowGroup.js
index 187ceea..94d400f 100644
--- a/js/dataTables.rowGroup.js
+++ b/js/dataTables.rowGroup.js
@@ -175,7 +175,7 @@ $.extend( RowGroup.prototype, {
 	 */
 
 	/**
-	 * Adjust column span or hiding cells when column visibility changes
+	 * Adjust column span when column visibility changes
 	 * @private
 	 */
 	_adjustColspan: function ()
@@ -193,7 +193,7 @@ $.extend( RowGroup.prototype, {
 				});
 			}
 		});
-		
+
 	},
 
 	/**
@@ -332,6 +332,7 @@ $.extend( RowGroup.prototype, {
 	_rowWrap: function ( display, className, level )
 	{
 		var row;
+		var dt = this.s.dt;
 		
 		if ( display === null || display === '' ) {
 			display = this.c.emptyDataGroup;
@@ -348,20 +349,22 @@ $.extend( RowGroup.prototype, {
 			row = display;
 		}
 		else {
+
 			row = $('<tr/>')
 				.append(
 					$('<td/>')
 						.attr( 'colspan', this._colspan() )
 						.append( display  )
 				);
-			
+
 			var displayTr = row.find('> td > tr');
 
-			if ( displayTr.length ){//dont wrap tr td around a tr
+			if ( displayTr.length ){
 				row = $(displayTr[0]);
-			}			
+			}
+
 		}
-		
+
 		var tds = $(row).children();
 		if ( tds.length === 1 ){
 			tds.attr( 'colspan', this._colspan());
@@ -371,7 +374,8 @@ $.extend( RowGroup.prototype, {
 				$(td).css('display', $(dt.column(i).header()).css('display'));//mimic the display val of the header
 			});
 		}
-		
+
+
 		return row
 			.addClass( this.c.className )
 			.addClass( className )