Get row number for a hidden table entry
Get row number for a hidden table entry
markstahler
Posts: 15Questions: 0Answers: 0
I am trying to assign entries in my table id numbers once the default sort options are applied (ie cant do it on server side). I can currently do this via jQuery by looping over the nodes and rewriting the tables combo TD as the rowIndex but this stops working once the loop hits table entries hidden by the pager. Is there a way to determine what row number a node will be if the page number is changed? 1-50 are visible on the first page but if node position 65 is now visible it will be 15th on the table (+ 50 for being second page) and would now be id number 65. Can anyone think of a way to do this? Thanks
This discussion has been closed.
Replies
- Is server-side processing indeed enabled, and that's what's stopping you from accessing pages 2 and beyond?
- If you ask for 50 records and your logic determines that 15 should be hidden, do you now only display 35 records?
- Pursuant to the above, how specifically are rows being hidden?
- Is the row number strictly necessary or is it primarily cosmetic?
If it's cosmetic, I don't see any reason you couldn't just persist a variable that remembers what the last row number was on the previous page, and increment by 1 to give you the first number on the next page.
I can access any page or any Node. All I am trying to do is determine, based on the users sorting options, which row would a particular node be displayed on if the pager were changed and that node became visible. For example, I have a 40 node table and a pager limit of 10 nodes. I loop through the nodes 1-10 (each having a position of 1 through 10) but once I get to node 11, which is hidden due to the pager, the rowIndex is -1. If the user switches to page 2, node 11 becomes node 1 or id 11 (1 + 10).
If I can do that then I can generate an id column for the table but there has to be an easy way to do this.
Something like this:
[code]
$('#mytable').dataTable( {
var currentRow = 0;
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
currentRow += 1;
$(nRow).attr('id', 'row-' + currentRow);
return nRow;
}
});
[/code]
The above code doesn't produce a column as you describe, but whatever method you're using to add your extra column now (some sort of jQuery loop) could be moved here instead of kept outside of the DataTables initialization object. In the callback, $(nRow) is just the jQuery object of your current row. You could use .append() or whatever other technique you want to add a column with the ID instead of just adding an ID attribute as I have done.
I believe the header row will actually get an ID of "row-1" in the above, but adjust the math as you need to. ;-)
[code]
var currentRow = 0;
$('#mytable').dataTable( {
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
var jqRow = $(nRow);
jqRow.prepend('');
currentRow += 1;
$('td:eq(0)', nRow).text(currentRow);
jqRow.attr('id', 'row-' + currentRow);
return nRow;
}
});
[/code]
Sorry I didn't flesh out how to add the header properly. You could in theory just have the extra header right in the HTML and then send back empty cells in the first row, thereby skipping the prepend part of the above as well. There are a few ways you could do it.
Glad it worked!
"fnInitComplete": function(oSettings) {
var anNodes = this.oApi._fnGetTrNodes( oSettings );
for (var currentRow = 1; currentRow <= anNodes.length; currentRow++){
var selector = $("#combinations-table tr:eq(" + currentRow + ") td:eq(0)");
selector.text(currentRow);
}
}