Loading a datatable after and ajax content load
Loading a datatable after and ajax content load
gordyr
Posts: 35Questions: 0Answers: 0
Hi,
I use ajax pagination on my site, with #rightcolumn div being the updated 'content' element.
When pulling in the page which contains my datatable I have some issues with it.
The table displays fine and is completely functional however everything I have modified with 'fnRowCallback' does not work properly.
Here is my fnRowCallback code:-
[code]
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
$('td:eq(1)', nRow).html( 'Play' );
$('td:eq(2)', nRow).html( '' );
$('td:eq(3)', nRow).html( '' + aData[0] + '' + aData[1] + '' );
$('td:eq(4)', nRow).addClass('hidden_column');
$('td:eq(5)', nRow).html( '' + aData[5] + '' );
$('td:eq(6)', nRow).html( '' + aData[7] + '' );
return nRow;
},
[/code]
I am inserting divs to give me some more styling options and also obviously to display images, use a lightbox and load an mp3 player.
This all works perfectly when the page itself is refreshed. But when the #rightcolumn div which contains the datatable is pulled into the page dynamically it all screws up.
Firebug shows the following:-
[quote]
"NetworkError: 404 Not Found - http://www.mysite.com/table/%27+sImageUrl+%27details_open.png%27+%27"
'+sIma....png'+'
"NetworkError: 404 Not Found - http://www.mysite.com/table/%27%20+%20aData%5B3%5D%20+%20%27"
' + aData[3] + '
"NetworkError: 404 Not Found - http://www.mysite.com/table/%27+%20oData%5B3%5D%20+%27"
[/quote]
It apears to be inserting character which is screwing up the returned data/links.
For instance an mp3 link which should return:
http://www.mysite.com/wp-content/uploads/2011/09/dt_intfc4e732d1f1276d_4e75fd50314fe.mp3?Zillion
Ends up returning:-
http://www.songbanc.com/table/' + aData[4] + '
Any help would be greatly appreciated.
I use ajax pagination on my site, with #rightcolumn div being the updated 'content' element.
When pulling in the page which contains my datatable I have some issues with it.
The table displays fine and is completely functional however everything I have modified with 'fnRowCallback' does not work properly.
Here is my fnRowCallback code:-
[code]
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
$('td:eq(1)', nRow).html( 'Play' );
$('td:eq(2)', nRow).html( '' );
$('td:eq(3)', nRow).html( '' + aData[0] + '' + aData[1] + '' );
$('td:eq(4)', nRow).addClass('hidden_column');
$('td:eq(5)', nRow).html( '' + aData[5] + '' );
$('td:eq(6)', nRow).html( '' + aData[7] + '' );
return nRow;
},
[/code]
I am inserting divs to give me some more styling options and also obviously to display images, use a lightbox and load an mp3 player.
This all works perfectly when the page itself is refreshed. But when the #rightcolumn div which contains the datatable is pulled into the page dynamically it all screws up.
Firebug shows the following:-
[quote]
"NetworkError: 404 Not Found - http://www.mysite.com/table/%27+sImageUrl+%27details_open.png%27+%27"
'+sIma....png'+'
"NetworkError: 404 Not Found - http://www.mysite.com/table/%27%20+%20aData%5B3%5D%20+%20%27"
' + aData[3] + '
"NetworkError: 404 Not Found - http://www.mysite.com/table/%27+%20oData%5B3%5D%20+%27"
[/quote]
It apears to be inserting character which is screwing up the returned data/links.
For instance an mp3 link which should return:
http://www.mysite.com/wp-content/uploads/2011/09/dt_intfc4e732d1f1276d_4e75fd50314fe.mp3?Zillion
Ends up returning:-
http://www.songbanc.com/table/' + aData[4] + '
Any help would be greatly appreciated.
This discussion has been closed.
Replies
Already solved the problem by putting the initialization code into an external file and loading it with the 'livequery' plugin. Works a treat though perhaps not the most elegant solution.