jquery - How to apply selector on ajax loaded content -


i have refresh() function, set called periodically way:

setinterval("refresh()", duration); 

in refresh() function, dynamically prepending content html table.

so have simple table:

<table>     <tbody>         <tr><td>original title</td><td>original date</td></tr>     </tbody> </table> 

that becomes new table:

<table>     <tbody>         <tr><td>new title</td><td>new date</td></tr>         <tr><td>original title</td><td>original date</td></tr>     </tbody> </table> 

through action of refresh() function:

function refresh() {     var lastdate = $('.mytableclass > tbody > tr > td:nth-child(2)').first().text();      $.get("./my_url.html?lastdate="+lastdate+, function (data) {         if( data.trim().length > 0 ) {             $(data).prependto( $('.mytableclass > tbody') ).fadein('slow');         }     }); } 

(the my_url.html page returns simple <tr>....</tr> line.)

everything works fine during first call refresh(), , new content succesfully prepended table.

my problem after first call, when there no more new content add, following calls refresh() keep prepending same content table.

so if let refresh being called 4 times, getting table :

<table>     <tbody>         <tr><td>new title</td><td>new date</td></tr>         <tr><td>new title</td><td>new date</td></tr>         <tr><td>new title</td><td>new date</td></tr>         <tr><td>new title</td><td>new date</td></tr>         <tr><td>original title</td><td>original date</td></tr>     </tbody> </table> 

i found out happens because lastdate var never correctly updated new line's date, contains date original first line.

what missing here? how can new date ajax-prepended first <tr> line of table ? way select table > tbody > tr ... not compatible ajax-loaded stuff?

[edit] if it's worth something, using jquery 1.6.1.

you have change refresh function this.

var lastdate = $('.mytableclass > tbody > tr > td:nth-child(2)').first().text(); function refresh() {     $.get("./my_url.html?lastdate="+lastdate+, function (data) {         if( data.trim().length > 0 ) {            $(data).prependto( $('.mytableclass > tbody') ).fadein('slow');         }     }).done(function(){         lastdate = $('.mytableclass > tbody > tr:first > td:nth-child(2)').text();    }); } 

you need use done() function, gets called after ajax request completed , it'll give latest date..


Comments

Popular posts from this blog

windows - Single EXE to Install Python Standalone Executable for Easy Distribution -

c# - Access objects in UserControl from MainWindow in WPF -

javascript - How to name a jQuery function to make a browser's back button work? -