A DataTables plugin for mark.js to highlight search terms in tables
MIT License
datatables.mark.js is a plugin to integrate mark.js – a JavaScript keyword highlighter – into DataTables. It detects column specific or global searches and highlights the search term in the table.
Either clone or download this plugin manually, or with npm:
$ npm install datatables.mark.js --save-dev
Or with Bower using:
$ bower install datatables.mark.js --save-dev
Alternatively the plugin is also available on the following CDN's:
Because the DataTables CDN only updates plugins at own releases and you can't specify an explicit plugin version, it's recommended to use jsDelivr.
This plugin depends on:
When using a module loader like CommonJS (e.g. Webpack) or AMD (e.g. RequireJS) they will be loaded automatically.
Finally, you'll have to embed one of these files:
into your application, by either referencing the file manually using e.g.:
<script src="vendor/datatables.mark.js/dist/datatables.mark.js"></script>
or loading it with AMD or CommonJS.
When using RequireJS you should configure the names of dependent modules as following:
This is important as datatables.mark.js will load these modules as dependencies. You might have a look at this example.
Activation in the DataTables options:
$(".myTable").DataTable({
mark: true
});
Activation by default for all DataTables instances:
$.extend(true, $.fn.dataTable.defaults, {
mark: true
});
Activation with custom mark.js options:
$(".myTable").DataTable({
mark: {
// ... custom option properties, e.g.
// className: "highlight"
}
});
Please head over to the mark.js website for an overview of possible options.
Now that you've activated the plugin you just need to define your custom styles
for the highlighted elements. If you haven't defined a custom element
or
className
in the mark.js options the default element will be mark
without
having a class assigned. If you don't want to have custom styles, you can embed
one of the default CSS files:
See the contribution guidelines.
Changes are documented in release descriptions.
Happy hacking!