Access new page when row is clicked...

shimy1984

First off, DataTables is amazing!

How in the world do you navigate to another page by clicking a row from a datatable? I've been searching all over this forum and through the documentation as well as through google.

I am using serverside scripting (mysql and php) and everything is working properly... I just need to be able to click on a row, retrieve the ID from the first column, then navigate to another page with the ID as a $_GET[] variable.

I want the entire row clickable, not just links embedded within each cell.

Any ideas?

Thanks in advance.

shimy1984

An example of the jQuery code:

[code]
$(document).ready(function() {
$('#tblRequests tbody tr').each( function() {
var sTitle;
var nTds = $('td', this);
var sID = $(nTds[0]).text();
var sMatter = $(nTds[1]).text();
sTitle = sID;

this.setAttribute( 'title', sTitle );
} );

oTable = $('#tblRequests').dataTable( {
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "requestSort.php",
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"bStateSave": false,
"aaSorting": [ [0,'desc'] ],
"aoColumns": [ null,null]
} );

$( oTable.fnGetNodes() ).click( function() {
alert(sTitle);
} );
} );
[/code]

shimy1984

I figured it out. See code below. I hope this helps other noobs. :)

Thanks again to Allen for such a great tool!

[code]
$(document).ready(function() {
$('#example').dataTable( {
"fnRowCallback": function( nRow, aData ) {
$('td:eq()', nRow).click(function(){
// aData[0] contains my ID.. will be used as $_GET[] variable for navigation to new page.
alert("http://sample.com?id="+aData[0]);
});
return nRow;
}
} );
} );
[/code]

allan

Hi shimy1984,

Great to hear you got it sorted, and thanks very much for posting your code - very useful indeed :-)

Regards,
Allan