Hi,
I'm using jQuery to manipulate an Interactive Report (reformat it to behave as a nested/floating table so that the report headers stay put while the data scrolls within a div) namely by adding the required HTML tags in certain places.
In any case, I have the crux of the matter sorted out, except the code breaks when moving between results through pagination.
I can understand that this is a result of the AJAX call being made to replace the table with new data. In this situation, the jQuery code is obviously not being re-fired and thus the next set of results that load revert back to the original interactive report format.
My question is to find the appropriate jQuery/AJAX syntax that can listen or bind to the pagination AJAX call. I am not familiar with AJAX but have been able to use the following code to test whether jQuery could pick up on AJAX calls at all, testing for all events.
$.ajax({
ajaxStart : function(){
console.log("hello 1");
},
beforeSend: function(){
console.log("hello 2");
},
ajaxSend : function(){
console.log("hello 3");
},
success : function(){
console.log("hello 4");
},
ajaxSuccess : function(){
console.log("hello 5");
},
error : function(){
console.log("hello 6");
},
ajaxError : function(){
console.log("hello 7");
},
complete : function(){
console.log("hello 8");
},
ajaxComplete : function(){
console.log("hello 9");
},
ajaxStop : function(){
console.log("hello 10");
}
});
It returned for
beforeSend,
success and
complete for the initial page load, but did not respond to subsequent ajax events (e.g., when paginating to a new set of rows). I speculate that this is due to the nature of the AJAX call. jQuery responded to a GET method used on page load, but not a POST method used for pagination.
I hope this is enough direction for community members with knowledge to assist. Any help provided would be greatly appreciated.