Jets.js icon indicating copy to clipboard operation
Jets.js copied to clipboard

Display message "nothing found'?

Open suntrop opened this issue 7 years ago • 1 comments

Is there any chance I can implement something to display "Sorry, nothing found/no matches"? if there is nothing to match in the list? Currently it is just blank.

suntrop avatar Oct 23 '17 09:10 suntrop

This should work:

<input id="searchInput" onsearch="javascript:jets.search()" type="search" /><button class="search" onClick="javascript:jets.search()" type="submit">&gt</button>
<ul class="searchable">
	<a href="#1">Item 1</a>
	<a href="#2">Item 2</a>
</ul>

<div id="no_results" style="display:none">No results found</div>

<script>
var jets = new Jets({
	searchTag: '#searchInput',
	contentTag: '.searchable',
	callSearchManually: true,
	didSearch: function(search_phrase) {
		var nr = document.getElementById('no_results');
		var hasResults = $('.searchable a:visible').length;
		if ( ! hasResults) {
			nr.style.display = 'block'; // Results found
		} else {
			nr.style.display = 'none'; // No results
		}
	}
});
</script>

R3gi avatar Nov 04 '18 18:11 R3gi