table data dissapears in the DOM when page is changed?

table data dissapears in the DOM when page is changed?

tbone587tbone587 Posts: 18Questions: 0Answers: 0
edited September 2012 in General
I have a datatable setup for a table that has columns with a checkbox that have an associated css class. I am tracking how many checkboxes are checked and it works fine until I switch pages in the table. Once I switch the page on the table view, it no longer reads the checkbox state. I used firefox firebug and it seems like the data in the dom is gone once the page of the table is changed. I was al

Replies

  • allanallan Posts: 63,535Questions: 1Answers: 10,475 Site admin
    DataTables removes the TR elements that it doesn't need to display for a give page, so it is likely you are encountering that. You can use the $ or fnGetNodes API methods to get all elements from the table.

    Allan
  • tbone587tbone587 Posts: 18Questions: 0Answers: 0
    Allan,

    I have used the below code to allow me to sort by checked items, which works nicely. I want to make a new function that is modified slightly that just returns a number of boxes checked. How can I call this function at any time?

    [code]
    $.fn.dataTableExt.afnSortData['dom-checkbox'] = function ( oSettings, iColumn )
    {
    var aData = [];

    $( 'td:eq('+iColumn+') input', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {

    //Item Checked
    if (this.checked == true)
    {
    aData.push("1");
    }

    //Not Checked
    else
    {
    aData.push("0");
    }

    } );
    return aData;
    }
    [/code]
  • tbone587tbone587 Posts: 18Questions: 0Answers: 0
    I figured it out:) Below is the function I created to provide a count of selected checkedboxes in the first column:

    [code]
    //Find User Checkboxes Selected
    function CalculateSelectedUsers()
    {
    var oSettings = userDataTableList.fnSettings();
    var columnIndex = 0;
    usersChecked = 0;

    $( 'td:eq('+columnIndex+') input', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {

    //Item Checked
    if (this.checked == true)
    {
    usersChecked++;
    }
    });

    return (usersChecked);
    }
    [/code]
  • allanallan Posts: 63,535Questions: 1Answers: 10,475 Site admin
    This would work as well:

    [code]
    userDataTableList.$('input:checked').length
    [/code]

    Assuming you only have one column for checkboxes - otherwise you could refine the selector a bit.

    Allan
  • tbone587tbone587 Posts: 18Questions: 0Answers: 0
    thank you very much allan, that is a cleaner way to do this for sure! I am really loving these data tables!
  • allanallan Posts: 63,535Questions: 1Answers: 10,475 Site admin
    > I am really loving these data tables!

    Thank you :-)

    Allan
This discussion has been closed.