Question

I have this search script on my page which search through the displayed table. The table is displayed with PHP from a database. It is actually a list, and this list is sorted out alphabetically with the help of hyperlinks of A to Z. Now I need to search the whole database instead of displayed ones. Any helps or resources would be helpful. 🙂

$(document).ready(function() {

    $("#search").keyup(function() {

        if($(this).val() != "") {

            $("#some_table tbody>tr").hide();
            $("#some_table td:contains-ci('" + $(this).val() + "')").parent("tr").show();
        } else {
            $("#some_table tbody>tr").show();
        }
    });
});

$.extend($.expr[":"], {
    "contains-ci" : function(elem, i, match, array) {
        return (elem.textContent || elem.innerText || $(elem).text() || "").toLowerCase().indexOf((match[3] || "").toLowerCase()) >= 0;
    }
});

Answer 1

Perhaps return the results from the server as a json object.

http://your.hostname/database.json returns [{id:1,name:'joe'},{id:2,name:'bob'},...].

Then, dynamically create the displayed table.

function refreshTable() {
    $.ajax({
        url:'http://your.hostname/database.json',
        dataType:'json'
    }).done(function(json) {
        $('#my_table tbody tr').remove();
        for (i in json) {
            $('#my_table tbody').append($('<tr><td>'+json[i]['id']+'</td><td>'+json[i]['name']+'</td></tr>'));
        }
    });
}

Call refreshTable when the page is initially loaded, and maybe on certain intervals, or when the user presses a “refresh” button or something.

glhf!