New feature plug-in: Search highlighting - see

http://datatables.net/blog/2014-10-22 for details
pull/113/head
Allan Jardine 10 years ago
parent f99d15aa1d
commit 277e773d3d

@ -4,22 +4,17 @@
/**
* @summary AlphabetSearch
* @description Show an alphabet aloneside a table providing search input options
* See http://datatables.net/blog/2014-09-22 for details
* @description Show an set of alphabet buttons alongside a table providing
* search input options
* @version 1.0.0
* @file dataTables.alphabetSearch.js
* @author SpryMedia Ltd (www.sprymedia.co.uk)
* @contact www.sprymedia.co.uk/contact
* @copyright Copyright 2014 SpryMedia Ltd.
* @license MIT - http://datatables.net/license/mit
*
* This source file is free software, available under the following license:
* MIT license - http://datatables.net/license/mit
*
* This source file is distributed in the hope that it will be useful, but
* WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
* or FITNESS FOR A PARTICULAR PURPOSE. See the license files for details.
*
* For details please refer to: http://www.datatables.net
* For more detailed information please see:
* http://datatables.net/blog/2014-09-22
*/
(function(){

@ -0,0 +1,6 @@
table.dataTable span.highlight {
background-color: #FFFF88;
}

@ -0,0 +1,65 @@
/*! SearchHighlight for DataTables v1.0.0
* 2014 SpryMedia Ltd - datatables.net/license
*/
/**
* @summary SearchHighlight
* @description Search term highlighter for DataTables
* @version 1.0.0
* @file dataTables.searchHighlight.js
* @author SpryMedia Ltd (www.sprymedia.co.uk)
* @contact www.sprymedia.co.uk/contact
* @copyright Copyright 2014 SpryMedia Ltd.
* @license MIT - http://datatables.net/license/mit
*
* This feature plug-in for DataTables will highlight search terms in the
* DataTable as they are entered into the main search input element, or via the
* `search()` API method.
*
* It depends upon the jQuery Highlight plug-in by Bartek Szopka:
* http://bartaz.github.io/sandbox.js/jquery.highlight.js
*
* Search highlighting in DataTables can be enabled by:
*
* * Adding the class `searchHighlight` to the HTML table
* * Setting the `searchHighlight` parameter in the DataTables initialisation to
* be true
* * Setting the `searchHighlight` parameter to be true in the DataTables
* defaults (thus causing all tables to have this feature) - i.e.
* `$.fn.dataTable.defaults.searchHighlight = true`.
*
* For more detailed information please see:
* http://datatables.net/blog/2014-10-22
*/
(function(window, document, $){
$(document).on( 'init.dt.dth', function (e, settings, json) {
var table = new $.fn.dataTable.Api( settings );
var body = $( table.table().body() );
if (
$( table.table().node() ).hasClass( 'searchHighlight' ) || // table has class
settings.oInit.searchHighlight || // option specified
$.fn.dataTable.defaults.searchHighlight // default set
) {
table
.on( 'draw.dt.dth column-visibility.dt.dth', function () {
// On each draw highlight search results, removing the old ones
body.unhighlight();
// Don't highlight the "not found" row
if ( table.rows( { filter: 'applied' } ).data().length ) {
body.highlight( table.search() );
}
} )
.on( 'destroy', function () {
// Remove event handler
table.off( 'draw.dt.dth column-visibility.dt.dth' );
} );
}
} );
})(window, document, jQuery);
Loading…
Cancel
Save