How do I make API calls when using multiple tables

Rick

Hi All,

I've got multiple identical tables on the page and initializing using this code:
[code]
var oTable = $('.alertList table').dataTable({"bFilter": true,
"aoColumnDefs": [
{"bVisible": false, "aTargets": [ 3 ]}
]});
[/code]

Since I have two tables on the page (for now), when I use firebug to print the value of oTable on the console (console.log(oTable)) I see
[code]
jQuery(table, table)
[/code]

I then want to create a click event that will fetch data from the hidden column. I'm doing it this way:
[code]
oTable.each(function(index) {
$(this).children('tbody').children('tr').click(function() {
var position = oTable.fnGetPosition(this);
var alertDetail = oTable.fnGetData(position)[3];
alert('data: '+ alertDetail);
});
});
[/code]
This works when clicking rows on the first table but I get the following error when clicking on the second table.
[code]
oTable.fnGetData(position) is null
var alertDetail = oTable.fnGetData(position)[3];
[/code]
I'm sure the problem is because I have 2 tables and I don't know how to reference the second one in the click event.

Thanks for your help!
Rick

allan

When using multiple tables from a single selector, the table that the API functions will work on is controlled by the variable:

[code]
$.fn.dataTableExt.iApiIndex
[/code]
So if you wanted to use an API function on the second table you might do:

[code]
$.fn.dataTableExt.iApiIndex = 1;
oTable.fnGetData();
[/code]
Allan

Rick

Allan - thanks for your quick response and great product.