diff --git a/README.md b/README.md index 59204c2..56b3995 100644 --- a/README.md +++ b/README.md @@ -57,6 +57,8 @@ This plugin provides the following configuration options: | onSearchFocus | `false` | Allows you to define a function to be called when the search input is focussed. The `this` context of this function will be the search input element. | | onSearchBlur | `false` | Allows you to define a function to be called when the search input is blurred. The `this` context of this function will be the search input element. | | clearOnLoad | `false` | Determines whether the search input should be cleared on page load (either `true` or `false`). | +| matcherFunction | `null` | A custom matcher function. Should return a function to be run against each `childSelector`. | +| matchOnElement | `false` | If `true`, the element identified by `selector` is provided to the matcher function. If `false`, jQuery `.text()` is called on it first. Useful if `matcherFunction` provided. | ### Example usage @@ -89,7 +91,16 @@ $( '#element' ).searchable({ onSearchBlur: function() { $( '#feedback' ).hide(); }, - clearOnLoad: true + clearOnLoad: true, + matchOnElement: true, + matcherFunction: function(term) { + // this copies the logic of the plugin's default matcher, but matches on an element (rather than a text input) to demonstrate the `matchOnElement` option + term = $.trim(term).toLowerCase(); + return function(column) { + return (column.text().toLowerCase().indexOf(term) !== -1); + }; + } +} }); ``` @@ -104,6 +115,10 @@ $( '#element' ).searchable({ - Added some events that allow you to call custom functions during the search lifecycle: onSearchActive, onSearchEmpty, onSearchFocus, onSearchBlur (view the [configuration](#configuration) for more information). - Added the `clearOnLoad` setting which allows you to clear the search input on page load / refresh. +**Version 1.2.0:** + +- Added `matchOnElement` and `matcherFunction` options (IE version not updated). + ## Contributing & Issues Please feel free to submit any issues or pull requests, they are more then welcome. When submitting an issue, please specify the version number and describe the issue in detail so that it can be solved as soon as possible! diff --git a/jquery.searchable.js b/jquery.searchable.js index c0d243a..e69a8a3 100644 --- a/jquery.searchable.js +++ b/jquery.searchable.js @@ -1,12 +1,12 @@ /*! - * jQuery Searchable Plugin v1.0.0 + * jQuery Searchable Plugin v1.2.0 * https://github.com/stidges/jquery-searchable * * Copyright 2014 Stidges * Released under the MIT license */ ;(function( $, window, document, undefined ) { - + var pluginName = 'searchable', defaults = { selector: 'tbody tr', @@ -22,7 +22,9 @@ onSearchEmpty: false, onSearchFocus: false, onSearchBlur: false, - clearOnLoad: false + clearOnLoad: false, + matchOnElement: false, + matcherFunction: null }, searchActiveCallback = false, searchEmptyCallback = false, @@ -44,7 +46,7 @@ init: function() { this.$searchElems = $( this.settings.selector, this.$element ); this.$search = $( this.settings.searchField ); - this.matcherFunc = this.getMatcherFunction( this.settings.searchType ); + this.matcherFunc = this.settings.matcherFunction || this.getMatcherFunction( this.settings.searchType ); this.determineCallbacks(); this.bindEvents(); @@ -100,7 +102,7 @@ }, search: function( term ) { - var matcher, elemCount, children, childCount, hide, $elem, i, x; + var matcher, elemCount, children, childCount, hide, $elem, i, x, elem_for_match if ( $.trim( term ).length === 0 ) { this.$searchElems.css( 'display', '' ); @@ -125,7 +127,8 @@ hide = true; for ( x = 0; x < childCount; x++ ) { - if ( matcher( $( children[ x ] ).text() ) ) { + elem_for_match = this.settings.matchOnElement ? $(children[ x ]) : $(children[ x ]).text() + if (matcher(elem_for_match)) { hide = false; break; } @@ -181,10 +184,9 @@ $.fn[ pluginName ] = function( options ) { return this.each( function() { - if ( !$.data( this, 'plugin_' + pluginName ) ) { - $.data( this, 'plugin_' + pluginName, new Plugin(this, options) ); - } + $.removeData( this, 'plugin_' + pluginName) // this also `delete`s the old plugin var if there is one + $.data( this, 'plugin_' + pluginName, new Plugin(this, options) ) }); }; -})( jQuery, window, document ); +})( jQuery, window, document ); \ No newline at end of file