I have posted picture. I am not getting datatables sorting on first tr tag. I have datatables individual column searching with select on second tr tag... but i want sorting on 1st tr tag and using scripts of theme dashboard working on theme but not woking on my project.Posted Picture for clear concept.
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="">
Blade
<div class="card-content collapse show">
<div class="table-responsive" id="searchResult">
<table class="table table table-striped table-bordered base-
style" id="myTable">
<thead class="table table-striped">
<tr>
<th>Supplier Name</th>
<th>Item Name</th>
<th>Quantity</th>
<th>Price</th>
<th>Total</th>
<th>Purchase Date</th>
<th>Actions</th>
</tr>
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
@foreach($allPurchases as $purchase)
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td><a onclick="edit_purchases()"><i style="font-size: 18px" class="far fa-edit"></i>
</a> | <a
href=""><i style="color: red;font-size: 18px" class="far fa-trash-alt"></i>
</a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
Script:
<script>
var dataTableList = "";
$(document).ready(function () {
dataTableList = $('#myTable').DataTable({
initComplete: function () {
this.api().columns([0,1]).every( function () {
var column = this;
var select = $('<select><option value=""></option></select>')
.appendTo( $(column.header()))
.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>' )
} );
} );
},
});
});
</script>
via Chebli Mohamed
Aucun commentaire:
Enregistrer un commentaire