[jQuery] second Ajax content loaded reset that first one
<div dir="ltr">Hi all. I have a need to create a form with remote content. Please look this code:
1) ajaxform loads table content
$('#frm').ajaxForm({
target: '#divResponse',
dataType: 'html',
success: function(data) {
$('.results').html(data).show();
}
});
2) divResponse is a table with every row haves a loadCountry class. If user clicks in a row I'll want to load the second remote content for the single ID
$('.loadCountry').livequery('click', function(){ loadURL(this); });
3) loadURL
function loadURL(countryID)
{
var row = countryID;
$.get("getCountry.cfm", { u: <a href="http://row.id">row.id</a> }, function(data){
var $contents = trim12( data );
$( '#' + <a href="http://row.id">row.id</a> ).append( $contents );
});
}
My problem is: after first remote content is loaded(table with ajaxform) and I click in a row Firebug display the remote call with success but loadURL(second remote content call) remove that first remote content loaded.
What's wrong with this code?
Cheers
Marco Antonio
</div>