Get row number for a hidden table entry

Get row number for a hidden table entry

markstahlermarkstahler Posts: 15Questions: 0Answers: 0
edited September 2011 in General
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

Replies

  • GregPGregP Posts: 500Questions: 10Answers: 0
    I keep making guesses, and it's probably the late hour, so I'll just ask for some clarification instead of making a total ass out of myself:

    - 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.
  • markstahlermarkstahler Posts: 15Questions: 0Answers: 0
    Sorry I explained this poorly.

    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.
  • GregPGregP Posts: 500Questions: 10Answers: 0
    edited September 2011
    If you have access to the whole data object (all your data is in memory), I would just use fnRowCallback to add the IDs to rows for the whole table.

    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. ;-)
  • GregPGregP Posts: 500Questions: 10Answers: 0
    I didn't sort out how to add the cell for the header, but quickly whipped this up for the rows themselves. The above code isn't going to do it (the var is in the wrong place, for starters):

    [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.
  • markstahlermarkstahler Posts: 15Questions: 0Answers: 0
    GregP, that RowCallback worked perfectly. I was scouring the documentation but did not come across that. Thank you very much. Where is your tip jar?
  • GregPGregP Posts: 500Questions: 10Answers: 0
    Send any tips to Allan. ;-) I'm happy to help. I don't know everything in the API off by heart (when people start talking about the plugins in particular I really have to dig) but there are a few functions I use regularly, and DT's set of callbacks are at the core.

    Glad it worked!
  • markstahlermarkstahler Posts: 15Questions: 0Answers: 0
    I tried this solution and although it looked like it worked initially, I ran into issues once the DataTable required pagination. Once pages were changed the callback was executed again and screwed up the original order that I wanted to persist. Looks like I would need to use fnInitComplete or something similar but get access to the rows.
  • markstahlermarkstahler Posts: 15Questions: 0Answers: 0
    edited October 2011
    This is how I solved this problem.

    "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);
    }
    }
This discussion has been closed.