fnReloadAjax() Clears ANYTHING (Including form fields etc)

netman

It's been more than a year since my last post (This is good: No News -> Good News ;-) ).
But let's get to the point.
I was "playing around" with a page containing some forms + dynamically (via AJAX) updated "elements (mostly text-html fields) and a Data Table when I face the fact that, whenever i was calling fnReloadAjax(), everything including forms/text/html was reset (including the table :-) ).
SO i'd like to ask, is this normal ?!

Here after you may find the JS code i'm using. Observe the 'alert' after calling fnReloadAjax().I was trying to see if the alert would execute after the call ... but, nothing happens!!! Why not?!(This is my "Second Question" Is it normal that any other "function"/call after calling fnReloadAjax(), dows not been executed?) :
[code]
jQuery(document).ready(function($) {

// Create The Statistics Table
initMy_Table();
/* Statistics Table Creation with Data Tables for JQuery */
var My_Table;
function initMy_Table() {

My_Table = $('#example').dataTable( {
"bDestroy": true,
"bProcessing": true,
"bFilter": false,
"sAjaxSource": 'g.php?stats=month&tt=d',
"aoColumns": [
/* Hideme */ { "bSearchable": false, "bVisible": false },
/* Stats */ { "bSortable": false, "bSearchable": false, "bVisible": true },
/* 1 */ { "bSortable": false, "bSearchable": false, "bVisible": true},
/* 2 */ { "bSortable": false, "bSearchable": false, "bVisible": true},
/* 3 */ { "bSortable": false, "bSearchable": false, "bVisible": true},
/* 4 */ { "bSortable": false, "bSearchable": false, "bVisible": true},
/* 5 */ { "bSortable": false, "bSearchable": false, "bVisible": true},
/* 6 */ { "bSortable": false, "bSearchable": false, "bVisible": true},
/* 7 */ { "bSortable": false, "bSearchable": false, "bVisible": true},
/* 8 */ { "bSortable": false, "bSearchable": false, "bVisible": true},
/* 9 */ { "bSortable": false, "bSearchable": false, "bVisible": true},

} );
}

// Start Button startpractice_dateTime
var _practicecount = 0;

$("#start").click(function() {
var startpractice_dtime = "";
$.get("time.php",{},
function(datas){
var datas = datas.split('|');
$("#shotstart").text(datas[0] + " " + datas[1]);
$("#week").text(datas[2]);
startpractice_dtime = datas[0] + " " + datas[1];
});
});

//Submit Button Start
$(".submit").click(function() {
var T_1 = $("#_1").val();
var startpractice_dtime = $("#shotstart").text();
var practice_week = $("#week").text();
var _player_name = $("#inputString").val();
var dataString = '_1=' + T_1;

//update some 'elements"
_practicecount += 1;
_sendedserials = _practicecount+1;
$("#practicecount").text("some words to say: " + _practicecount );
$("#serial").text("Serial: " + _sendedserials + "th" );

// Timers
var endpractice_dtime = "";
$.get("time.php",{},
function(datas){
var datas = datas.split('|');
var myyear = datas[0];
var mytime = datas[1];
$("#shotend").text(datas[0] + " " + datas[1]);
$("#shotstart").text("Waiting to start" );
endpractice_dtime = datas[0] + " " + datas[1];
});
{
$('.success').fadeOut(1000).hide();
$('.error').fadeOut(1000).show();
}
else
{
$.ajax({
type: "POST",
url: "RTW.php",
async: false,
data: dataString,
success: function(){
$('.success').fadeIn(1000).show();
$('.error').fadeOut(1000).hide();
} // Success Function
}); // ajax POST End

} // else END
// Reset DataTable and Refresh it with new Data
var My_Table = $('#example');
My_Table.fnReloadAjax();
// After calling the above function ... does anything else "work" ? NOoooo !!!!
alert ("Good afternoon in " + dataString);
return false;
} // Submit Button Function END
); // Click on "Subit" END

}); //JQuery Document load END

//Some Other JS "stuff"
function lookup(inputString) {
if(inputString.length == 0) {
// Hide the suggestion box.
$('#suggestions').hide();
} else {
$.post("php/users.php", {queryString: ""+inputString+""}, function(data){
if(data.length >0) {
$('#suggestions').show();
$('#autoSuggestionsList').html(data);
}
});
}
} // lookup

function fill(thisValue) {
$('#inputString').val(thisValue);
setTimeout("$('#suggestions').hide();", 200);
} //fill


[/code]

Regards
Steve

allan

Hi Steve,

I'd be surprised if this doesn't give a Javascript error:

[code]
var My_Table = $('#example');
My_Table.fnReloadAjax();
[/code]
jQuery doesn't have an fnReloadAjax function - DataTables does. Try this:

[code]
var My_Table = $('#example').dataTable();
My_Table.fnReloadAjax();
[/code]
Also remember that the reload is async, so the code just after will execute before the table has reloaded. fnReloadAjax has a callback function option you can use for this.

For the form data - it will destroy everything in the table, but not outside it. I'd have a look and see if you are getting a JS error there, as above first :-)

Allan

netman

Gasp !!!
I'm terrible sorry for that.
You were right (of course) about the missing .dataTable() !!!
But ... no JS error(s).

Now everything works "as it should be".

Thank you very much
Regards
Steve

allan

Heh - no problem. A second pair of eyes always helps! Funny that there is no JS error given - but as along as it works now... :-)

Regards,
Allan