Jquery - JS Clear Table Before New Search, Whitin Function Or Out?

- 1 answer

Currently I'm retrieving data from SharePoint 2010 via SPservices.

function getData() {


        operation: "GetListItems",

        async: true,

        listName: "RapportenLijst",

        completefunc: function (xData, Status) {


            $(xData.responseXML).SPFilterNode("z:row").each(function () {

               ......CODE HERE ESSENTIALY FILTERING z:row; manipulating them to Table rows.

                    $("#Search").blur(function () {


                        if ($("#Search").val() !== "") {
                        } else {
                            alert("Nothing to be searched.");

                        if (rapportCatEx.indexOf($("#Search").val() != "") != -1) {

                        var zoekOpdracht = this.value;
                        var zoekCat  = rapportCatEx.toLowerCase();
                        var zoekNaam = name.toLowerCase();

                        if (zoekNaam.indexOf($("#Search").val()) != -1) {



In here I made a Search functionality which filters the rows according to name and displaying it.

The problem is that at this point I got it to show searched results. But when the user needs another search it doesnt empty the previous search result.

I tried using..empty() but it just iterates, cleans the table, adds a row, cleans the table, adds a row.

Sow when multiple hits should be shown, it only shows one. When only one hit should be show, it shows the one.

How can I make it so that it only cleans the table for one time, and then appends all the found hits?

Is it that I execute the function whitin the function getData()?



You could use jQuery datatable with SPservices library as jQuery datatable has OOB search function.

Check the sample