jQuery DataTables: Row selection using checkboxes and Select extension

Comments

1. I have used custom date range filter in datatable. So I have initialize datatable instance in function. Now when I click trigger a function to get the values of checkbox it show me an error that instance variable is not defined.

   
   $(document).ready(function() {
   fetch_data();
   
       function fetch_data(is_date_search = '', date = '', type = '') {
           var table = $('#customerList').DataTable({
               "processing": true,
               "serverSide": true,
               "select": {
                    'style': 'multi'
               },
               "order": [],
               "ajax": {
                   "url": "",
                   "type": "POST",
                   "data": {
                       is_date_search: is_date_search,
                       date: date,
                       type: type
                   }
               },
                "columnDefs": [{
                   "targets": 0,
                   'searchable': false,
                   'orderable': false,
                   'checkboxes': {
                      'selectRow': true
                   }
                   // 'className': 'dt-body-center',
                   // 'render': function (data, type, full, meta){
                   //      return '<input type="checkbox" name="id[]" class="theClass" value="' + $('').text(data).html() + '">';
                   //  }
               },
               {
                   "name": "sr_no",
                   "targets": 1
               },
               {
                   "name": "c.name",
                   "targets": 2
               },
               {
                   "name": "c.mobile",
                   "targets": 3
               },
               {
                   "name": "c.email",
                   "targets": 4
               },
               {
                   "name": "c.birthdate",
                   "targets": 5
               },
               {
                   "name": "c.anniversary_date",
                   "targets": 6
               },
               {
                   "name": "c.created_at",
                   "targets": 7
               },
               {
                   "name": "feedback_count",
                   "targets": 8
               },
               {
                   "name": "rewards_points",
                   "targets": 9
               },
               {
                   "name": "coupons",
                   "targets": 10
               },
   
           ]
           });
   
           //draw table
           table.columns().every(function() {
               var table = this;
               $('input', this.header()).on('keyup change', function() {
               console.log(table.search());
                   if (table.search() !== this.value) {
                       table.search('')
                       table.columns().search('')
                       table.search(this.value).draw();  
                   }
               });
           });
       }
   
   
       //tooltip
   
   
   
   
       var start = moment().subtract(29, 'days');
       var end = moment();
   
       function cb(start, end) {
           $('#birthdate_picker').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
           $('#anniversary_date').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
           $('#created_at').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
       }
   
       $('#birthdate_picker').daterangepicker({
           startDate: start,
           endDate: end,
           ranges: {
               'Today': [moment(), moment()],
               'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
               'Last 7 Days': [moment().subtract(6, 'days'), moment()],
               'This Month': [moment().startOf('month'), moment().endOf('month')]
           }
       }, cb);
   
   
       cb(start, end);
   
   
   
   
       $(document).on('click','#message_to_send', function() {
           // var selectedIds = table.columns().checkboxes.selected()[0];
   
           // if (selectedIds != '') {
           //     $('#messageForm')[0].reset();
           //     $('#message_model').modal('show');
           // } else {
           //     alert('Please Select At least one contact number');
           // }
          var checkbox_value = [];
           var rows_selected = table.column(0).checkboxes.selected();
           // var rowcollection =  oTable.$(".dt-checkboxes:checked", {"page": "all"});
           rows_selected.each(function(index,elem){
               checkbox_value.push($(elem).val());
           });
           console.log(checkbox_value);
   
       });
   
   
   
   
   
       $('#birthdate_picker').on('change', function() {
           var birthdate = $('#birthdate_picker').val();
   
           if (birthdate) {
               $('#customerList').DataTable().destroy();
               fetch_data('yes', birthdate, 'c.birthdate');
           } else {
               alert('Date is required');
           }
   
       });
   
   
   });
   
   });
   

   Reply

2. how to selected chacbox only valid data invalid data not select and submit only valid data table plz hlp me

   Reply

3. Hai mr, how to get name or other rows values in this table ?
   Please

   Reply

4. var rows_selected = table.column(0).checkboxes.selected();
   

   With this the id will be fetching perfectly.
   But, By checking the multiple check box or single check box i need the column, such as “name” or “position” with separated by comma,with respect to the checkbox checked on the particular rows.

   I tried with,

   var rows_selected = table.column(1).checkboxes.selected();
   

   or

   var rows_selected= table.columns().checkboxes.selected()[0][1];
   

   Nothing will happen, please help me.

   Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.