Question

I've implemented the quicksearch plugin by Rik Lomas and I love it for an application in a custom CMS I'm building. I was wondering though, since I'm going to have a bizillion items in the table if there's a way to use the data from my json callback to populate the table as a user searches rather than the table contents themselves.

So when you load the page the chain of events would go something like this:

-jQuery.getJSON request -Initiate quicksearch and limit the number of rows initially presented in the table -As the user makes keystrokes in the filter, the new values are pulled from the JSON data rather than the table contents (still limiting the number displayed in the table) and the table is updated.

My JSON request:

$.getJSON("jsonrequest.php", function(data){

    $.each(data, function(i){
        $("#result tbody").append('<tr><td>' + this.organization + '</td><td>' + this.city + '</td><td>' + this.state + '</td></tr>');
    });

});

My quicksearch function:

$('table#result tbody tr').quicksearch({
    position: 'before',
    attached: 'table#result',
    stripeRowClass: ['evenrows', ''],
    labelText: 'Filter Results: ',
    loaderText: '',
    delay:0,
    focusOnLoad:true
});
Was it helpful?

Solution

If this helps anyone I've implemented the jQuery plugin DataTables to solve this one, which offers grid functions, pagination and a live filter. It seems to be the most versatile grid plugin I've come across for my needs.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top