JezK
Edit File: shipment.php
<?php include("header.php"); ?> <div class="container"> <div class="container mt-3"> <div class="row px-md-4 px-0"> <div class="tophead col-md-4"> <h6>Shipment status</h6> </div> <div class="col-md-4"> </div> <div class="col-md-4"> <!-- <div class="input-group search-button mb-2" style="margin-right:10px;"> <span class="input-group-prepend"> <button class="btn btn-outline-secondary border-right-0 border" type="button" style="border-top-left-radius:20px;border-bottom-left-radius:20px"> <i class="fa fa-search"></i> </button> </span> <input class="form-control border-left-0 border align-self-right active" type="text" value="" id="myInput" list="cityname" style="border-top-right-radius:20px;border-bottom-right-radius:20px;"> <datalist id="cityname"> <option value="Boston"> <option value="Cambridge"> <option value="500p"> </datalist> </div> --> </div> </div> </div> <div class="container "> <div class="table-responsive p-4 "> <table id="example" class="display bg-white tbl-border table-borderless" style="width:100%"> <thead> <tr> <th>Warehouse Name</th> <th>Warehouse ID</th> <th>Request Type</th> <th>Reference Type</th> <th>Customer Name</th> <th>Customer Type</th> <th>Value</th> <th>Date</th> <th>Time</th> <th>Status</th> </tr> </thead> </table> </div> </div> <div class="container"> <div class="row"> <div class="col-md-4"> <!-- <div class="form-group d-flex"> <label class="c_grey">Show entries</label> <select class="form-control show_entities" id="sel1" > <option value="10">10</option> <option value="25">25</option> <option value="100">100</option> <option value="500">500</option> </select> </div> --> </div> <div class="col-md-4 mt-1 align-items-center"> <div id="pagination"></div> </div> <div class="col-md-4 text-right "> <button id="export" class="btn btn-primary"><i class="fa fa-upload"></i><span class="pl-2">EXPORT.CSV</span></button> </div> </div> </div> </div> <!-- footer --> <?php include("footer.php"); ?> <!-- <script src="js/jquery.min.js"></script> --> <!-- <script src="js/jquery.pagination.min.js"></script> --> <!----> <script> $(document).ready(function() { $('#example').DataTable( { "processing": true, "dataSrc": "", // "sDom": 'Rlfrtlip', // "serverSide": true, // dom: 'Bfrtip', // buttons: [ // { // extend: 'csvHtml5', // text: '<i class="fa fa-file-text-o"></i>Export to csv', // titleAttr: 'CSV' // }, // ], "ajax": "shipments.json", "columns": [ { "data": "Warehouse Name" }, { "data": "Warehouse ID" }, { "data": "Request Type" }, { "data": "Reference Type" }, { "data": "Customer Name" }, { "data": "Customer Type" }, { "data": "Value" }, { "data": "Date" }, { "data": "Time" }, { "data": "Status" }, ] } ); } ); </script>