library-mirrors/tablesorter
1
0
Fork 0
mirror of https://github.com/Mottie/tablesorter.git synced 2024-11-15 23:54:22 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

add resizable_addLastColumn widget option

Browse Source
This commit is contained in:
Mottie 2013-03-30 10:14:42 -05:00
parent 2e12043b91
commit a5fe8668cc
3 changed files with 48 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
docs/example-widget-resizable.html
View File

@ -23,13 +23,22 @@
<script id="js">$(function() {
// call the tablesorter plugin
$("table").tablesorter({
$("table:first").tablesorter({
theme : 'blue',
// initialize zebra striping and resizable widgets on the table
widgets: [ "zebra", "resizable" ]
widgets: [ "zebra", "resizable" ],
widgetOptions: {
resizable_addLastColumn : true
}
});
$("table:last").tablesorter({
theme : 'blue',
// initialize zebra striping and resizable widgets on the table
widgets: [ "zebra", "resizable" ],
widgetOptions: {
resizable_addLastColumn : true
}
});
});</script>

40
docs/index.html
View File

@ -300,7 +300,7 @@
</ul>
</li>
<li><a href="example-widget-grouping.html">Grouping rows Widget</a> <span class="tip"><em>New</em></span> v2.8.</li>
<li><a href="example-widget-resizable.html">Resizable Columns widget</a> (v2.0.23.1; <span class="tip"><em>Modified</em></span> v2.7.4)</li>
<li><a href="example-widget-resizable.html">Resizable Columns widget</a> (v2.0.23.1; <span class="tip"><em>Updated</em></span> v2.8.3)</li>
<li><a href="example-widget-savesort.html">Save sort widget</a> (v2.0.27)</li>
<li><a href="example-widget-sticky-header.html">Sticky header widget</a> (v2.0.21.1)</li>
<li>UITheme widget:
@ -740,14 +740,14 @@
<tr id="headertemplate">
<td><a href="#" class="toggle2">headerTemplate</a></td>
<td>String</td>
<td>'{content} {icon}'</td>
<td>'{content}'</td>
<td>This is a template string which allows adding additional content to the header while it is being built. <span class="tip"><em>New!</em></span> v2.7.
<div class="collapsible"><br>
This template string has two default tags: <code>{content}</code> and <code>{icon}</code>.<br>
This template string has two modifying tags: <code>{content}</code> and <code>{icon}</code>.<br>
<code>{content}</code> will be replaced by the current header HTML content.<br>
<code>{icon}</code> will be replaced by <code>&lt;i class=&quot;tablesorter-icon&quot;&gt;&lt;/i&gt;</code>, but only if a class name is defined in the <code>cssIcon</code> option.<br>
<br>
This template string may also contain HTML, e.g (<code>'&lt;em&gt;{content}&lt;/em&gt;'</code>)<br>
This template string may also contain HTML, e.g (<code>'&lt;em&gt;{content}&lt;/em&gt; {icon}'</code>)<br>
<br>
After the template string is built, the <code>onRenderTemplate</code> function is called to allow further manipulation. Please read more about this <a href="#onrendertemplate"><code>onRenderTemplate</code> function</a> and/or check out the example (link to the right).
</div>
@ -1310,6 +1310,8 @@ $(function(){
// *** resizable widget ***
// if false, resized columns are not saved for next page reload
resizable : true,
// if true, the last column will be resizable (use in non-full width tables)
resizable_addLastColumn: false,
// *** savesort widget ***
// if false, the sort will not be saved for next page reload
@ -1600,7 +1602,7 @@ $(function(){
<td>Object</td>
<td>null</td>
<td>
Filter widget: This option allows you to add custom controls within the filter widget row. <span class="tip"><em>New! v2.7.7</em></span><br>
Filter widget: This option allows you to add custom controls within the filter widget row. <span class="tip"><em>New!</em> v2.7.7</span><br>
<div class="collapsible">
<br>
A new file has been included named "jquery.tablesorter.widgets-filter-formatter.js". It includes code to add jQuery UI and HTML5 controls via the <a href="#widget-filter-formatter"><code>filter_formatter</code></a> option.<br>
@ -1995,7 +1997,7 @@ $('table').trigger('search', false);</pre></div>
Resizable widget: If this option is set to <code>false</code>, resized column widths will not be saved. Previous saved values will be restored on page reload (v2.4).
<div class="collapsible">
<br>
Use the <a href="#widget-resizable"><code>"resizable"</code></a> option to change the css class name as follows:
Use the <a href="#widget-resizable"><code>"resizable"</code></a> option to not save the resized widths:
<pre class="prettyprint lang-javascript">$(function(){
$("table").tablesorter({
widgets: ["resizable"],
@ -2009,6 +2011,30 @@ $('table').trigger('search', false);</pre></div>
<td><a href="example-widget-resizable.html">Example</a></td>
</tr>
<tr id="widget-resizable-addlastcolumn">
<td><a href="#" class="toggle2">resizable_addLastColumn</a></td>
<td>Boolean</td>
<td>false</td>
<td>
Resizable widget: If this option is set to <code>true</code>, a resizing anchor will be included in the last column of the table <span class="tip"><em>New!</em></span> v2.8.3.
<div class="collapsible">
<br>
If an anchor was included and the table is full width, the column would resize in the opposite direction which my not be intuitive to the user. So set this option as desired, but please be mindful of the user experience.<br>
<br>
Use the <a href="#widget-resizable-addlastcolumn"><code>"resizable_addLastColumn"</code></a> option to include the last column resizer as follows:
<pre class="prettyprint lang-javascript">$(function(){
$("table").tablesorter({
widgets: ["resizable"],
widgetOptions : {
// css class name applied to the sticky header
resizable_addlastcolumn : true
}
});
});</pre></div>
</td>
<td><a href="example-widget-resizable.html">Example</a></td>
</tr>
<tr id="widget-savesort">
<td><a href="#" class="toggle2">saveSort</a></td>
<td>Boolean</td>
@ -2017,7 +2043,7 @@ $('table').trigger('search', false);</pre></div>
saveSort widget: If this option is set to <code>false</code>, new sorts will not be saved. Any previous saved sort will be restored on page reload (v2.4).
<div class="collapsible">
<br>
Use the <a href="#widget-savesort"><code>"saveSort"</code></a> option to change the css class name as follows:
Use the <a href="#widget-savesort"><code>"saveSort"</code></a> option to not save the current sort:
<pre class="prettyprint lang-javascript">$(function(){
$("table").tablesorter({
widgets: ["saveSort"],

3
js/jquery.tablesorter.widgets.js
View File

@ -906,7 +906,8 @@ $.tablesorter.addWidget({
// Firefox needs this inner div to position the resizer correctly
$c.wrapInner('<div class="tablesorter-wrapper" style="position:relative;height:100%;width:100%"></div>');
}
$c = $c.slice(0,-1); // don't include the last column of the row
// don't include the last column of the row
if (!wo.resizable_addLastColumn) { $c = $c.slice(0,-1); }
$cols = $cols ? $cols.add($c) : $c;
});
$cols