Resizable: Add resizable_includeFooter option. Fixes #1386

Mottie · Apr 14, 2017 · caf9445 · caf9445
1 parent 36986e1
commit caf9445
Show file tree

Hide file tree

Showing 4 changed files with 47 additions and 5 deletions.
diff --git a/dist/js/widgets/widget-resizable.min.js b/dist/js/widgets/widget-resizable.min.js
diff --git a/docs/example-widget-resizable.html b/docs/example-widget-resizable.html
@@ -180,6 +180,17 @@ <h4>Resizable widget defaults (added inside of tablesorter <code>widgetOptions</
 						</td>
 					</tr>
 
+					<tr id="resizable-include-footer">
+						<td><a href="#" class="permalink">resizable_includeFooter</a></td>
+						<td>true</td>
+						<td>When <code>true</code>, the resizable handle will extend into the table footer (<span class="version">v2.28.8</span>).
+							<div class="collapsible">
+								<p>When <code>true</code>, this option includes the entire height of the table footer. If the table does not include a footer, the resize handle will stop at the last row.</p>
+								<p>If <code>false</code>, the resizable handle will not extend into the table footer.</p>
+							</div>
+						</td>
+					</tr>
+
 					<tr id="resizable-widths">
 						<td><a href="#" class="permalink">resizable_widths</a></td>
 						<td>[ ]</td>
@@ -262,6 +273,16 @@ <h3>
 			<th>Date</th>
 		</tr>
 	</thead>
+	<tfoot>
+		<tr>
+			<th>First Name</th>
+			<th>Last Name</th>
+			<th>Age</th>
+			<th>Total</th>
+			<th>Discount</th>
+			<th>Date</th>
+		</tr>
+	</tfoot>
 	<tbody>
 		<tr><td>Peter</td><td>Parker</td><td>28</td><td>$9.99</td><td>20%</td><td>Jul 6, 2006 8:14 AM</td></tr>
 		<tr><td>John</td><td>Hood</td><td>33</td><td>$19.99</td><td>25%</td><td>Dec 10, 2002 5:14 AM</td></tr>

diff --git a/docs/index.html b/docs/index.html
@@ -505,7 +505,7 @@ <h4 id="extras">Plugins / Widgets<br>
 		<li><a href="example-widget-print.html">Print widget</a> (<span class="version">v2.16.4</span>; <span class="version updated">v2.25.8</span>).</li>
 		<li><a href="example-widget-reflow.html">Reflow widget</a> (<span class="version">v2.16</span>; <span class="version updated">v2.19.0</span>).</li>
 		<li><a href="example-widgets.html">Repeat headers widget</a> (v2.0.5; <span class="version updated">v2.19.0</span>).</li>
-		<li><span class="results">&dagger;</span> <a href="example-widget-resizable.html">Resizable columns widget</a> (v2.0.23.1; <span class="version updated">v2.28.5</span>).</li>
+		<li><span class="results">&dagger;</span> <a href="example-widget-resizable.html">Resizable columns widget</a> (v2.0.23.1; <span class="version updated">v2.28.8</span>).</li>
 		<li><span class="results">&dagger;</span> <a href="example-widget-savesort.html">Save sort widget</a> (v2.0.27; <span class="version updated">v2.24.0</span>).</li>
 		<li><a href="example-widget-scroller.html">Scroller widget</a> (<span class="version">v2.9</span>; <span class="version updated">v2.28.5</span>).</li>
 		<li><span class="label label-info">Beta</span> <a href="example-widget-sort-to-hash.html">Sort-to-hash widget</a> (<span class="version">v2.22.4</span>; <span class="version updated">v2.28.6</span>).</li>
@@ -2051,6 +2051,10 @@ <h4>Custom theme</h4>
       // will be included in the last column of the table
       resizable_addLastColumn: false,
 
+      // If this option is set to true, the resizable handle will extend
+      // into the table footer
+      resizable_includeFooter: true,
+
       // Set this option to the starting & reset header widths
       resizable_widths: [],
 
@@ -3854,6 +3858,19 @@ <h4>Comparison example</h4>
 				<td><a href="example-widget-resizable.html">Example</a></td>
 			</tr>
 
+			<tr id="widget-resizable-includefooter">
+				<td><a href="#" class="permalink">resizable_includeFooter</a></td>
+				<td>Boolean</td>
+				<td>true</td>
+				<td>Resizable widget: If this option is set to <code>true</code>, the resizable handle will extend into the table footer (<span class="version">v2.28.8</span>).
+					<div class="collapsible">
+						<p>When <code>true</code>, this option includes the entire height of the table footer. If the table does not include a footer, the resize handle will stop at the last row.</p>
+						<p>If <code>false</code>, the resizable handle will not extend into the table footer.</p>
+					</div>
+				</td>
+				<td></td>
+			</tr>
+
 			<tr id="widget-resizable-widths">
 				<td><a href="#" class="permalink">resizable_widths</a></td>
 				<td>Array</td>
@@ -3904,7 +3921,7 @@ <h4>Comparison example</h4>
 				<td></td>
 			</tr>
 
-			<tr id="resizable-target-last">
+			<tr id="widget-resizable-target-last">
 				<td><a href="#" class="permalink">resizable_targetLast</a></td>
 				<td>Boolean</td>
 				<td>false</td>

diff --git a/js/widgets/widget-resizable.js b/js/widgets/widget-resizable.js
@@ -163,6 +163,10 @@
 					tableHeight += $this.filter('[style*="height"]').length ? $this.height() : $this.children('table').height();
 				});
 			}
+
+			if ( !wo.resizable_includeFooter && c.$table.children('tfoot').length ) {
+				tableHeight -= c.$table.children('tfoot').height();
+			}
 			// subtract out table left position from resizable handles. Fixes #864
 			startPosition = c.$table.position().left;
 			$handles.each( function() {
@@ -333,10 +337,10 @@
 		options: {
 			resizable : true, // save column widths to storage
 			resizable_addLastColumn : false,
+			resizable_includeFooter: true,
 			resizable_widths : [],
 			resizable_throttle : false, // set to true (5ms) or any number 0-10 range
-			resizable_targetLast : false,
-			resizable_fullWidth : null
+			resizable_targetLast : false
 		},
 		init: function(table, thisWidget, c, wo) {
 			ts.resizable.init( c, wo );