Editing results while being appended?

Question

I have the following script which displays data returned from a serverside page onto the clientside page:

function getResults() {
    var search; 
    search = $(".txtSearch").val(); 

    $.ajax({
        url: 'search.aspx',
        type: 'POST',
        data: { strPhrase:search },
        error: function(xhr, status, error)
        success: function(results) 
        { 
            $("#ResultsContainer").empty(); 
            $("#ResultsContainer").append(results); 
        }
    });
}

Is it possible to check the results returned as they are being appended and make changes to it?

For example, imagine the results returned is html as follows:

<div><a href="link1.xls">link 1</a></div>
<div><a href="link2.xls">link 2</a></div>
<div><a href="link3.doc">link 3</a></div>
<div><a href="link4.xls">link 4</a></div>

Is it possible to check for .doc in the links and remove the full div around that particular link leaving just the following?

<div><a href="link1.xls">link 1</a></div>
<div><a href="link2.xls">link 2</a></div>
<div><a href="link4.xls">link 4</a></div>

Answer 1

Yes, try this:

success: function(results) 
    { 
        var $results = $(results);
        $results.find('a[href$=doc]').parent().remove();
        $("#ResultsContainer").empty().append($results); 
    }

This places the results in a jQuery object, turning the String into DOM elements.

Then it uses jQuery's .find() method to locate nested <a> elements where the href attribute ends with doc.

It then traverses up to its .parent() element, and calls .remove().

Notice that the .append() method appends the $results that was modified. Not the original results string.

Answer 2

I haven't used it myself, but jQuery.ajax takes a dataFilter member, which is a callback to sanitise the data before the success handler sees it.

Check out the docs - http://api.jquery.com/jQuery.ajax/

Answer 3

It would be better, for a matter of performance, if your aspx page would returns a html fragment without "doc" links, even if you could filter later on ajax callback.

And it would be better if you would send a json with a simple object containing the url (to the non-doc file) because you have a lot of redundant code.

Answer 4

Hello,

If by

as they are being appended

you mean while they are sent from the server to the client I would say probably not (or not with jQuery). Prototype has a callback onInteractive - (Not guaranteed) Triggered whenever the requester receives a part of the response (but not the final part), should it be sent in several packets. that may do that but even so it will be hard to process chunks.

If you say you have control over the sender you should implement a pagination system: On the first request the server script returns you, say, 10 results and the total number of pages. You process those results (display them if you want to) then request the next page and so on.

Also you should do the filtering on the server by sending the filter conditions to the script (if this is possible).