Populating a column after initial population and sort

Populating a column after initial population and sort

jessepunterjessepunter Posts: 3Questions: 0Answers: 0
edited January 2013 in General
Completely new to DataTables so forgive me if this is basic stuff.

I've previously used other JScript tables and they've had a way to populate a column after a table has been populated and sorted on/before display. This is useful as I load and create a table dynamically and, without sorting the data myself at either MySQL level or in an array, I have been able to populate the table with my raw data, sort it on (for example) Total Points, then populate the first column with the relevant position number that that score yields in the whole table list.

As an example:

Position Player Race1 Race2 Total Points
JP1 95 85 180
JP2 100 100 200
JP2 90 80 170

After initial sorting on Total Points the table would be displayed as follows:

Position Player Race1 Race2 Total Points
JP2 100 100 200
JP1 95 85 180
JP2 90 80 170

And after this I would like to populate the first column accordingly:

Position Player Race1 Race2 Total Points
1 JP2 100 100 200
2 JP1 95 85 180
3 JP2 90 80 170

Is this possible in DataTable or should I do this prior to loading the table?

Thanks in advance for any help!

Replies

  • jessepunterjessepunter Posts: 3Questions: 0Answers: 0
    edited January 2013
    Okay, I've managed to get this to work piecing together forum examples, so if anyone is interested here is the code:

    $(document).ready(function() {
    oTable = $('#gpTable').dataTable({
    "bJQueryUI": true,
    "sPaginationType": "full_numbers",
    "aaSorting": [[ 22, "desc" ]],
    "sDom": 'T<"clear">lfrtip',
    "iDisplayLength": -1,
    "aLengthMenu": [[10, -1], [10, "All"]],
    "oTableTools": {
    "sSwfPath": "../DataTables-1.9.4/DataTables-1.9.4/extras/TableTools/media/swf/copy_csv_xls_pdf.swf",
    "aButtons": [
    "copy",
    "print",
    {
    "sExtends": "collection",
    "sButtonText": "Save",
    "aButtons": [ "csv", "pdf" ]
    }
    ]}
    });

    $(window).load(function() {
    var oTable = $('#gpTable').dataTable();
    var total = oTable.fnSettings().fnRecordsTotal();

    for(i = 0; i < total; i++) {
    var row = oTable.fnGetData(oTable.fnSettings().aiDisplay[i]);
    if(row == null){
    alert("Row is null");
    }
    oTable.fnUpdate( i+1, oTable.fnSettings().aiDisplay[i], 0 );
    }
    });
    });


    It may not be the nicest way to do it but I now get a pre-sorted table on initialization and then the $(window).load(function() updates the first cell of each row to match that of the displayed position.

    If anyone has any better ideas then please feel free to let me know.

    Love DataTables already, even though a complete neewbie! Already making my site look and function much better.
  • jessepunterjessepunter Posts: 3Questions: 0Answers: 0
    And due to horrendous performance issues, primarily in IE, I should have not had the table automatically redraw on each row update, which it does as default. So the fnUpdate call should have been:

    oTable.fnUpdate( i+1, oTable.fnSettings().aiDisplay[i], 0, false, false );
This discussion has been closed.