mirror of
https://github.com/Mottie/tablesorter.git
synced 2024-11-15 23:54:22 +00:00
Filter: Add any match search by column text
This commit is contained in:
parent
f5f55e645e
commit
80bc854e68
2
dist/js/widgets/widget-filter.min.js
vendored
2
dist/js/widgets/widget-filter.min.js
vendored
File diff suppressed because one or more lines are too long
@ -94,20 +94,22 @@
|
||||
<h3><a href="#">AnyMatch Searches</a></h3>
|
||||
<div>
|
||||
<ul>
|
||||
<li>In <span class="version">v2.27.5</span>, you can target specific columns using a partial match of the header text. Updated below.</li>
|
||||
<li>In <span class="version">v2.20.0</span>, the anyMatch filter can target specific columns using the following format:
|
||||
<pre class="prettyprint lang-js">#:{query}</pre>
|
||||
<pre class="prettyprint lang-js">{column}:{query}</pre>
|
||||
<ul>
|
||||
<li>where <code>#</code> is the column <strong>one-based index</strong> (non-developers count from one)</li>
|
||||
<li>where <code>{column}</code> is the column <strong>one-based index</strong> (non-developers count from one) or a partial match of the case-insensitive column text.</li>
|
||||
<li>and <code>{query}</code> is the specific column query.</li>
|
||||
</ul>
|
||||
<br>
|
||||
You can disable this type of search by setting the new <code>filter_columnAnyMatch</code> option to <code>false</code>.
|
||||
<h4>Examples</h4>
|
||||
<ul>
|
||||
<li><button type="button" data-column="all">4:>30</button> Find values > 30 in the age column</li>
|
||||
<li><button type="button" data-column="all">2:aa</button> Include a fuzzy search (see <code>filter_defaultFilter</code> setting) and look for "aa" in the first name column (four results should show).</li>
|
||||
<li><button type="button" data-column="all">1:5 && 7:12</button> Find ranks with a "5" in them and find dates with a "12" </li>
|
||||
<li>This column specific anyMatch does not support using an OR column search like <code>1:5|7:12</code> </li>
|
||||
<li><button type="button" data-column="all">4:>30</button> or <button type="button" data-column="all">age:>30</button> Find values > 30 in the age column</li>
|
||||
<li><button type="button" data-column="all">2:aa</button> or <button type="button" data-column="all">first:aa</button> Include a fuzzy search (see <code>filter_defaultFilter</code> setting) and look for "aa" in the first name column (four results should show).</li>
|
||||
<li><button type="button" data-column="all">1:5 && 7:12</button> or <button type="button" data-column="all">rank:5 && date:12</button> Find ranks with a "5" in them and find dates with a "12" </li>
|
||||
<li>This column specific anyMatch does not support using an OR column search like <code>1:5|7:12</code>.</li>
|
||||
<li><button type="button" data-column="all">name:e</button> Find names (First AND Last) that contain an "e". This searches <em>both</em> name columns, so it is essentially the same as using <button type="button" data-column="all">first:e && last:e</button>. Remember this method does not provide an "OR" type search.</li>
|
||||
</ul>
|
||||
<p></p>
|
||||
<span class="label label-info">* NOTE *</span> Fixed in <span class="version">v2.22.0</span>. <del>When a AnyMatch search of this type is active, it adds filter queries to specific columns, so if the filters are saved and you reload the page, the specified <em>column filters will become populated</em> along with the AnyMatch search</del>.
|
||||
|
@ -1339,7 +1339,17 @@
|
||||
res = query[ indx ].split( ':' );
|
||||
if ( res.length > 1 ) {
|
||||
// make the column a one-based index ( non-developers start counting from one :P )
|
||||
id = parseInt( res[0], 10 ) - 1;
|
||||
if ( isNaN( res[0] ) ) {
|
||||
$.each( c.headerContent, function( i, txt ) {
|
||||
// multiple matches are possible
|
||||
if ( txt.toLowerCase().indexOf( res[0] ) > -1 ) {
|
||||
id = i;
|
||||
filters[ id ] = res[1];
|
||||
}
|
||||
});
|
||||
} else {
|
||||
id = parseInt( res[0], 10 ) - 1;
|
||||
}
|
||||
if ( id >= 0 && id < c.columns ) { // if id is an integer
|
||||
filters[ id ] = res[1];
|
||||
query.splice( indx, 1 );
|
||||
|
@ -74,7 +74,7 @@ jQuery(function($){
|
||||
'<th class="total">Total</th>' +
|
||||
'<th>Discount</th>' +
|
||||
'<th>Date</th>' +
|
||||
'<th class="last2">Last Name2</th>' +
|
||||
'<th class="last2">L4st N4me2</th>' +
|
||||
'</tr></thead><tbody>' +
|
||||
'<tr><td>1</td><td>Philip Aaron Wong</td><td>Johnson Sr Esq</td><td>25</td><td>$5.95</td><td>22%</td><td>Jun 26, 2004 7:22 AM</td><td>Johnson Sr Esq</td></tr>' +
|
||||
'<tr><td>11</td><td>Aaron</td><td>Hibert</td><td>12</td><td>$2.99</td><td>5%</td><td>Aug 21, 2009 12:21 PM</td><td>Hibert</td></tr>' +
|
||||
@ -198,7 +198,7 @@ jQuery(function($){
|
||||
wo = this.wo,
|
||||
$table = this.$table,
|
||||
table = this.table;
|
||||
assert.expect(37);
|
||||
assert.expect(40);
|
||||
|
||||
return QUnit.SequentialRunner(
|
||||
function(actions, assertions) {
|
||||
@ -294,6 +294,15 @@ jQuery(function($){
|
||||
).nextTask(
|
||||
function(){ ts.setFilters( table, ['', '', '', '', '', '', '', '', '1:5 && 7:12'] ); },
|
||||
function(){ assert.cacheCompare( table, 3, [45, 65], 'search "1:5 && 7:12" in anyMatch', true ); }
|
||||
).nextTask(
|
||||
function(){ ts.setFilters( table, ['', '', '', '', '', '', '', '', 'rank:5 && date:12'] ); },
|
||||
function(){ assert.cacheCompare( table, 3, [45, 65], 'search "rank:5 && date:12" in anyMatch', true ); }
|
||||
).nextTask(
|
||||
function(){ ts.setFilters( table, ['', '', '', '', '', '', '', '', 'name:e'] ); },
|
||||
function(){ assert.cacheCompare( table, 1, ['Peter', 'Bruce', 'Bruce Lee', 'Brenda Dexter'], 'search "name:e" in anyMatch', true ); }
|
||||
).nextTask(
|
||||
function(){ ts.setFilters( table, ['', '', '', '', '', '', '', '', 'first:e && last:e'] ); },
|
||||
function(){ assert.cacheCompare( table, 1, ['Peter', 'Bruce', 'Bruce Lee', 'Brenda Dexter'], 'search "name:e" in anyMatch', true ); }
|
||||
).nextTask( // test filter_startsWith (false by default)
|
||||
function(){
|
||||
wo.filter_startsWith = false;
|
||||
|
Loading…
Reference in New Issue
Block a user