A search bar component for filtering DOM nodes based on content.
Include the script:
<script src="https://cdn.jsdelivr.net/npm/domni-search@0.1.0/dist/domni-search.min.js"></script>
Have a host input search element and a couple elements amongst which to search:
<input type="search" />
<ul>
<li>foo</li>
<li>foo bar</li>
<li>foo baz</li>
<li>bar baz</li>
</ul>
After the page is loades, construct an index of the searchable DOM elements:
var idx = new SearchIndex('div > li');
// Second parameter is a boolean for case sensitivity. Defaults to false (insensitive).
Optionally store some settings in an object:
var settings = {
delay: 500, // ms to delay search after typing
any: false // wether to look for elements that match any word
};
And then decorate your input as a Domni Search Bar:
var bar = new SearchBar('input[type=search]', idx, settings);
If you have found any problems with this module, please:
- Open an issue.
- Describe what happened and how.
- Also in the issue text, reference the label
~bug
.
We will make sure to take a look when time allows us.
If you wish to get that awesome feature or have some advice for us, please:
- Open an issue.
- Describe your ideas.
- Also in the issue text, reference the label
~proposal
.
If you have spotted any enhancements to be made and is willing to get your hands dirty about it, fork us and submit your merge request so we can collaborate effectively.