View:
<?php
$attributes = array('class' => 'form-horizontal', 'id' => 'Form');
echo form_open($loginRedirect2,$attributes);
?>
<div class="stock_report" id="table_stock">
<div class="stock_report" id="table_stock_print">
<table id="order-listing" class="table">
<thead>
<tr class="bg-light">
<th><input type="checkbox" name="selectAll" id="selectAll" class="form-control" data-to-table="tasks" value=1></th>
<th>Code</th>
<
</tr>
</thead>
<tbody class="reportData">
<?php
if(is_array($employees)){
foreach($employees as $employee){
?>
<tr>
<td class="a-center "><input type="checkbox" name="selectall[]" class="form-control" value="<?php echo $employee['employeeId']; ?>"/></td>
<td><?php echo $employee['Code'];?></td>
</tr>
<?php
}
}else{
?>
<?php
}
?>
</tbody>
<tfoot>
<tr class="bg-light">
<th><input type="checkbox" name="selectAll" id="selectAll" class="form-control" data-to-table="tasks" value=1></th>
<th>Code</th>
</tr>
</tfoot>
</table>
</div>
</div>
<div class="shift_category form-group">
<button type="submit" class="btn btn-primary">Submit</button>
</div>
<?php echo form_close();?>
Script:
$(document).ready(function() {
var oTable = $('#order-listing').dataTable( {
initComplete: function () {
this.api().columns().every( function () {
var column = this;
var select = $('<select><option value=""></option></select>')
.appendTo( $(column.footer()).empty() )
.on( 'change', function () {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search( val ? '^'+val+'$' : '', true, false )
.draw();
} );
column.data().unique().sort().each( function ( d, j ) {
select.append( '<option value="'+d+'">'+d+'</option>' )
} );
} );
},
columnDefs: [ {
orderable: false,
className: 'select-checkbox',
targets: 0
} ],
select: {
style: 'multi',
selector: 'td:first-child'
},
lengthMenu: [[20,50, 100, -1], [20, 50, 100, "All"]],
pageLength: 20
} );
var allPages = oTable.fnGetNodes();
$('body').on('click', '#selectAll', function () {
if ($(this).hasClass('allChecked')) {
$('input[type="checkbox"]', allPages).prop('checked', false);
} else {
$('input[type="checkbox"]', allPages).prop('checked', true);
}
$(this).toggleClass('allChecked');
});
} );
Here is my datatable view and script.I added a checkbox to this datatable.But the problem is selectall option of checkbox is not properly working.Here this is a modal view.First time when i click the selectall button it is not working.When I press the escape button ,then open the modal,the selectall checkbox box click is working.How to solve this issue.
from Datatable checkbox issues
No comments:
Post a Comment