Finding Value of Hidden Rows Data Only

lennyhadley

    var table = $('#PositionRankings').DataTable({         
        "paging": true,
        "pageLength":10,
        "pagingType":"simple",  
        "info": false,
        "scrollX": true,
        "scrollCollapse": true,
        "order": [7, 'desc' ],
        dom: 'Bfrtip',
        buttons: [ ]
    });  

I have that table on this page: https://www.topflightfantasysports.com/fanduel-nba-optimizer/

Its using Pagination. The first column of this table is a checkbox, when the user hits the "Create Lineups" button at the bottom, I need to cycle through the table and find all the checkboxes that are checked yes. However my code only finds the ones that are currently showing and not the paginated rows that are hidden currently.

        $checkboxLock = $('.Locked:checkbox:checked');
        var LockArray = '';
        LockArray = $.map($checkboxLock, function(el){            
            if(el.checked) { 
                return '"' + el.id + '"'; 
            } else {                 
            };
        });           
        //alert(LockArray);
        console.log(LockArray);  

That's my current code to find them. If I view page source all the records are showing in the actual source. So I just need to know how to find the value of all the rows, not just the ones showing for my first column.

kthorngren

Well, unfortunately that code probably won't work since the only rows in the DOM are the rows being displayed. There are a couple choices. One is to keep track of the checked state in each row by setting the data to 1 or 0, for example. Or the other is to iterate each Datatable row and use node() to get the tr and check the checked state.

This example I created a long time ago to learn about checkboxes. So there is a lot going on but I think you are interested in the last few lines of code:
http://live.datatables.net/qagiqaqa/1/edit

 table.rows().every(function (rowIdx, tableLoop, rowLoop) {
      var data = this.node();
      console.log($(data).find('input').prop('checked'));
});

This way you don't have to track the checked state with a data value.

Kevin

lennyhadley

Well. That example you sent me is golden honeslty, alot of functionality in there I had questions about. Thank you so much. And yes, I'd prefer to just iterate through all the rows when the button is clicked rather than state saving I think. But I'll experiment. Thanks for the help!

lennyhadley

just to clarify, when cycling through, I see it shows me that they're checked. true or false is what i get back. How do I get the id of the first column?

kthorngren

Yep, the example may help you with the search plugin question you had earlier. If you still need help with that post back on your other thread.

Didn't try it so there may be errors but something like this:

table.rows().every(function (rowIdx, tableLoop, rowLoop) {
      var data = this.node();
      if ($(data).find('input').prop('checked')) {
            var id = this.data()[0];
      }
});

Or use this.data().myColumnHeader. If you want to get an API instance with the ID then use pluck().

Kevin

lennyhadley

That works awesome. Thank you so much. You just solved a worlds of problems for my site!

kthorngren

Awesome, glad its working.

Kevin

lennyhadley

@kthorngren one more question on this sorry. I'm trying to get the input values of the number inputs at the end of the table. Not the defaultValue, but the actual DOM value.

kthorngren

How about this example. Pulled a few rows from your example above:
http://live.datatables.net/fofupesi/1/edit

  $('#PositionRankings').on('change', 'input[type="number"]', function () {
    console.log($(this).val());
  })

Kevin

lennyhadley

doing the console.log($(this).val()) overwrites the default value? So then I can just use the regular datatables to get the value like above?

kthorngren

doing the console.log($(this).val()) overwrites the default value?

This is simply the jQuery val() method to get the value of an input. Its not Datatables specific and does not change anything.

So then I can just use the regular datatables to get the value like above?

Datatables does not know about DOM updates to the table, like inputs. You would use cell().invalidate() with some other prep code to update the Datatables data. for example:
http://live.datatables.net/dexilude/1/edit

Kevin