Need help with implementation of the jQuery LiveUpdate routine

Posted by miCRoSCoPiC_eaRthLinG on Stack Overflow See other posts from Stack Overflow or by miCRoSCoPiC_eaRthLinG
Published on 2010-04-29T02:49:07Z Indexed on 2010/04/29 2:57 UTC
Read the original article Hit count: 351

Filed under:
|
|
|
|

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

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about list