Need help with implementation of the jQuery LiveUpdate routine
- by miCRoSCoPiC_eaRthLinG
Hey all,
Has anyone worked with the LiveUpdate function (may be a bit of a misnomer) found on this page? It's not really a live search/update function, but a quick filtering mechanism for a pre-existing list, based on the pattern you enter in a text field.
For easier reference, I'm pasting the entire function in here:
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();
});
}
}
};
I have this list, with members as the ID. And a text field with say, qs as ID.
I tried binding the function in the following manner:
$( '#qs' ).liveUpdate( '#members' );
But when I do this, the function is called only ONCE when the page is loaded (I put in some console.logs in the function) but never after when text is keyed into the text field. I also tried calling the routine from the keyup() function of qs.
$( '#qs' ).keyup( function() {
$( this ).liveUpdate( '#members' );
});
This ends up going into infinite loops (almost) and halting with "Too much recursion" errors.
So can anyone please shed some light on how I am supposed to actually implement this function?
Also while you are at it, can someone kindly explain this line to me:
var score = this.score(term);
What I want to know is where this member method score() is coming from? I didn't find any such method built into JS or jQuery.
Thanks for all the help,
m^e