//in controller datatable ->addColumn('mass_delete', function ($row) { $selected = ''; return '<input type="checkbox" class="row-select test" value="'.$row->id.'">' ; }) //in view table <th>_<input type="checkbox" value="1" id="select-all-row" data-table-id="incoming-messages-table"></th> //in view datatable (to disable orderable on first column) 'columnDefs': [ { 'targets': [0], /* column index */ 'orderable': false, /* true or false */ }] //in view (action button and) <button type="submit" class="btn btn-xs btn-primary" id="delete-selected">{{__('admin.delete selected')}}</button> <form action="{{route('admin.incoming-messages.deleteArray')}}" method="post" id="delete_form"> @csrf <div class="inputs"> </div> </form> //in view js <script> $(document).on('click', '#select-all-row', function(e) { var table_id = $(this).data('table-id'); if (this.checked) { $('#' + table_id) .find('tbody') .find('input.row-select') .each(function() { if (!this.checked) { $(this) .prop('checked', true) .change(); } }); } else { $('#' + table_id) .find('tbody') .find('input.row-select') .each(function() { if (this.checked) { $(this) .prop('checked', false) .change(); } }); } }); $(document).on('click', '#delete-selected', function(e){ e.preventDefault(); $ids = ''; $html = ''; $("input:checkbox:checked").each(function(){ $ids += $(this).val() + ','; $html += '<input type="hidden" id="message_deleted" name="message[]" value="'+$(this).val()+'">'; }) $('.inputs').html($html); $('form#delete_form').submit() }) </script>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter