riklomas / quicksearch

A jQuery plugin for searching through tables, lists, etc quickly
http://www.lomalogue.com/jquery/quicksearch/
680 stars 261 forks source link

Tip: Add text highlighting to quicksearch plugin #65

Open echteinfachtv opened 11 years ago

echteinfachtv commented 11 years ago

If you want your text highlighted, you can use the jQuery Highlight Plugin together with quicksearch.

I am using it like that:

HTML <input type="text" name="search" value="" id="id_search" />

JS

$("#id_search").quicksearch("ul#searchlist li", {
    noResults: '#noresults',
    stripeRows: ['odd', 'even'],
    loader: 'span.loading',
    onBefore: function() { $("ul#searchlist li").unhighlight(); }, // remove former highlighting
    onAfter: function() { 
        if($('#id_search').val()!='') {
            $("ul#searchlist li:visible").highlight( $('#id_search').val() );
        }
    },
});

Hope that helps, quicksearch is a great plugins! Thanks.

Working example at: Mathe Videos www.echteinfach.tv