I am looking for a nice quick live search/filter.
Anybody use this? http://rikrikrik.com/jquery/quicksearch/#usage Also how do you combine it with pagination or ajax for large amounts of data?
Code:
HTML:
<form method="get" autocomplete="off" action="">
<input type="text" value="" name="q" id="q"><br><br>
</form>
<ul id="posts">
<li>One</li>
<li>Two</li>
<li>Three</li>
</ul>
JS:
$('#q').liveUpdate('#posts');
Using this as plugin:
jQuery.fn.liveUpdate = function(list){
list = jQuery(list);
if ( list.length ) {
var rows = list.children('li'),
cache = rows.map(function(){
return this.innerHTML.toLowerCase();
});
this
.keyup(filter).keyup()
.parents('form').submit(function(){
return false;
});
}
return this;
function filter(){
var term = jQuery.trim( jQuery(this).val().toLowerCase() ), scores = [];
if ( !term ) {
rows.show();
} else {
rows.hide();
cache.each(function(i){
var score = this.score(term);
if (score > 0) { scores.push([score, i]); }
});
jQuery.each(scores.sort(function(a, b){return b[0] - a[0];}), function(){
jQuery(rows[ this[1] ]).show();
});
}
}
};