diff --git a/app/Views/costListing.php b/app/Views/costListing.php
index 83679e4b..eb0c701f 100644
--- a/app/Views/costListing.php
+++ b/app/Views/costListing.php
@@ -1,76 +1,42 @@
 <style>
-  
-  .Date-filter-form {
-      display: flex;
-      align-items: center;
-      gap: 10px; /* Adjust the gap as needed */
-  }
-  .Date-filter-form input, .Date-filter-form button {
-      padding: 5px;
-      font-size: 14px;
-  }
-  .Date-filter-form button {
-      background-color: #007bff;
-      color: white;
-      border: none;
-      cursor: pointer;
-  }
-  .Date-filter-form button:hover {
-      background-color: #0056b3;
-  }
-  .icon-button {
-      background: none;
-      border: none;
-      cursor: pointer;
-      color: #007bff;
-      font-size: 18px;
-  }
-  .icon-button:hover {
-      color: #0056b3;
-  }
-</style> 
+    .Date-filter-form {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        /* Adjust the gap as needed */
+    }
 
+    .Date-filter-form input,
+    .Date-filter-form button {
+        padding: 5px;
+        font-size: 14px;
+    }
 
- <div class="modal fade" id="ccwizard" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
-          <div class="modal-dialog">
-              <div class="modal-content">
-                  <!-- Modal Header -->
-                  <div class="modal-header">
-                      <button type="button" class="close" data-dismiss="modal">
-                          <span aria-hidden="true">&times;</span>
-                          <span class="sr-only">Close</span>
-                      </button>
-                     <center><h4 class="modal-title" id="myModalLabel"></h4></center>
-                  </div>
+    .Date-filter-form button {
+        background-color: #007bff;
+        color: white;
+        border: none;
+        cursor: pointer;
+    }
 
-                  <!-- Modal Body -->
-                  <div class="modal-body">
-                      <form id="costCenterForm" class="form-horizontal" role="form">
-                          <div class="form-group">
-                              <div class="row">
-                                  <div class="col-md-3 col-md-offset-2">
-                                      Cost Center Name:
-                                  </div>
-                                  <div class="col-md-5">
-                                      <input type="text" name="CostCenterName" id="CostCenterName" class="form-control">
-                                      <input type="hidden" name="id" id="id" class="form-control">
-                                  </div>
-                              </div>
-                          </div>
-                      </form>
-                  </div>
+    .Date-filter-form button:hover {
+        background-color: #0056b3;
+    }
 
-                  <!-- Modal Footer -->
-                  <div class="modal-footer">
-                      <a class="btn btn-cancel" data-dismiss="modal">Cancel</a>
-                      <a class="btn btn-success font tempClick" id="tempClick">
-                          <span class="bold">Submit</span>
-                      </a>
-                  </div>
-              </div>
-          </div>
-      </div>
- <div class="content-page">
+    .icon-button {
+        background: none;
+        border: none;
+        cursor: pointer;
+        color: #007bff;
+        font-size: 18px;
+    }
+
+    .icon-button:hover {
+        color: #0056b3;
+    }
+</style>
+
+<div class="content-page">
     <div class="content">
         <!-- Start Content-->
         <div class="container-fluid">
@@ -83,74 +49,74 @@
                         </div>
                     </div>
                     <div class="col-6 text-right">
-                            <a data-toggle="modal" href="#ccwizard" data-id="0" data-name="" class="btn btn-success">Add New Cost List</a>
-                            <a class="btn btn-success" href="<?php echo base_url(); ?>exportcost">Export Cost Details <i class="fa fa-download" aira-hidden="true"></i></a>
+                        <a data-toggle="modal" href="#ccwizard" data-id="0" data-name="" class="btn btn-success">Add New Cost List</a>
+                        <a class="btn btn-success" href="<?php echo base_url(); ?>exportcost">Export Cost Details <i class="fa fa-download" aira-hidden="true"></i></a>
                     </div>
-                </div>  
+                </div>
                 <div class="row">
                     <div class="col-12">
                         <div class="card">
-                        <form class="Date-filter-form" id="DateRangeFilter" style="margin-top: 14px;margin-bottom: -11px;margin-left: 33px;">
-                                    <input type="hidden"  name="table" value="requisition">
-                                    <label for="fromDate">From:</label>
-                                    <input class="form-control date_range" type="date" id="fromDate" name="fromDate" placeholder="Select From Date" autocomplete="off" required>
+                            <form class="Date-filter-form" id="DateRangeFilter" style="margin-top: 14px;margin-bottom: -11px;margin-left: 33px;">
+                                <input type="hidden" name="table" value="requisition">
+                                <label for="fromDate">From:</label>
+                                <input class="form-control date_range" type="date" id="fromDate" name="fromDate" placeholder="Select From Date" autocomplete="off" required>
 
-                                    <label for="toDate">To:</label>
-                                    <input class="form-control date_range" type="date" id="toDate" name="toDate" placeholder="Select To Date" autocomplete="off" required>
+                                <label for="toDate">To:</label>
+                                <input class="form-control date_range" type="date" id="toDate" name="toDate" placeholder="Select To Date" autocomplete="off" required>
 
-                                    <button type="submit" class="range_search_button"><i class="fe-search" aria-hidden="true" class="icon-button" title="Search"></i></button>
-                                    <i class="fe-rotate-cw range_reset_button" aria-hidden="true" class="icon-button" id="resetButton" title="Reset"></i>
-                                    <div class="error" id="error"></div>
-                                </form>
+                                <button type="submit" class="range_search_button"><i class="fe-search" aria-hidden="true" class="icon-button" title="Search"></i></button>
+                                <i class="fe-rotate-cw range_reset_button" aria-hidden="true" class="icon-button" id="resetButton" title="Reset"></i>
+                                <div class="error" id="error"></div>
+                            </form>
                             <div class="card-body">
-                                
+
                                 <table id="cost_listing" class="table dt-responsive nowrap w-100">
                                     <thead style="background-color: #ddd;">
                                         <tr>
-                                        <th>Create Date</th>
-                                        <th>Create Time</th>
-                                        <th>Cost Center Code</th>
-                                        <th>Cost Center Name</th>
-                                        <th>Created By</th>
-                                        <th>Active</th>
-                                        <th>Action</th>
+                                            <th>Create Date</th>
+                                            <th>Create Time</th>
+                                            <th>Cost Center Code</th>
+                                            <th>Cost Center Name</th>
+                                            <th>Created By</th>
+                                            <th>Active</th>
+                                            <th>Action</th>
                                         </tr>
                                     </thead>
                                     <tbody>
                                         <?php
                                         if (!empty($userRecords)) {
-                                            foreach ($userRecords as $record) {                    
-                                            $createdat = new DateTime($record->CreatedDate);
-                                            $date = $createdat->format('d-m-Y');
-                                            $time = $createdat->format('h:i A');
+                                            foreach ($userRecords as $record) {
+                                                $createdat = new DateTime($record->CreatedDate);
+                                                $date = $createdat->format('d-m-Y');
+                                                $time = $createdat->format('h:i A');
                                         ?>
-                                            <tr>
-                                                <td><?php echo $date; ?></td>  
-                                                <td><?php echo $time; ?></td>
-                                            <td><?php echo $record->code ?></td>
-                                            <td><?php echo $record->CostCenterName ?></td>
-                                            <!--   <td><?php echo $record->ApprovedBy ?></td> -->
-                                            <td><?php echo $record->FirstName ?></td>
-                                            <td><?php
-                                                    $R = '';
-                                                    $record->IsActive == 1 ? $R = 'ACTIVE' : $R = 'INACTIVE';
-                                                    echo $R;
-                                                    ?></td>
-                                            <td>
-                                                <?php
-                                                if ($record->DeletedBy == '') {
-                                                ?>
-                                                <a data-toggle="modal" href="#ccwizard" data-id="<?php echo $record->id; ?>" data-name="<?php echo $record->CostCenterName; ?>" ><i class="fas fa-pencil-alt"></i></a>
-                                                <a href="<?php echo base_url() . 'deleteCostCenter?CostCode=' . $record->code; ?>"><i class="fa fa-trash"></i>&nbsp;&nbsp;&nbsp;</a>
-                                                <?php } ?>
-                                            </td>
-                                            </tr>
+                                                <tr>
+                                                    <td><?php echo $date; ?></td>
+                                                    <td><?php echo $time; ?></td>
+                                                    <td><?php echo $record->code ?></td>
+                                                    <td><?php echo $record->CostCenterName ?></td>
+                                                    <!--   <td><?php echo $record->ApprovedBy ?></td> -->
+                                                    <td><?php echo $record->FirstName ?></td>
+                                                    <td><?php
+                                                        $R = '';
+                                                        $record->IsActive == 1 ? $R = 'ACTIVE' : $R = 'INACTIVE';
+                                                        echo $R;
+                                                        ?></td>
+                                                    <td>
+                                                        <?php
+                                                        if ($record->DeletedBy == '') {
+                                                        ?>
+                                                            <a data-toggle="modal" href="#ccwizard" data-id="<?php echo $record->id; ?>" data-name="<?php echo $record->CostCenterName; ?>"><i class="fas fa-pencil-alt"></i></a>
+                                                            <a href="<?php echo base_url() . 'deleteCostCenter?CostCode=' . $record->code; ?>"><i class="fa fa-trash"></i>&nbsp;&nbsp;&nbsp;</a>
+                                                        <?php } ?>
+                                                    </td>
+                                                </tr>
                                         <?php
                                             }
                                         }
                                         ?>
                                     </tbody>
-                                    </table>
+                                </table>
                             </div> <!-- end card body-->
                         </div> <!-- end card -->
                     </div><!-- end col-->
@@ -159,29 +125,43 @@
         </div> <!-- container -->
     </div> <!-- content -->
 </div>
+<!-- for Add and edit Modal -->
+<div id="ccwizard" class="modal fade" tabindex="-1" role="dialog"
+    aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h4 class="modal-title"></h4>
+                <button type="button" class="close" data-dismiss="modal"
+                    aria-hidden="true">×</button>
+            </div>
+            <div class="modal-body p-4">
+                <form id="transporterForm" class="form-horizontal" role="form">
+                    <div class="form-group">
+                        <div class="row">
+                            <div class="col-md-4 col-md-offset-2">
+                                Cost Center Name:
+                            </div>
+                            <div class="col-md-6">
+                                <input type="text" name="CostCenterName" id="CostCenterName" class="form-control">
+                                <input type="hidden" name="id" id="id" class="form-control">
+                            </div>
+                        </div>
+                    </div>
+                </form>
 
- <script type="text/javascript" src="<?php echo base_url(); ?>public/assets/js/common.js" charset="utf-8"></script>
- <script src="https://cdn.datatables.net/plug-ins/1.10.16/sorting/datetime-moment.js"></script>
- <script type="text/javascript">
-  //  $(function() {
-  //    $.fn.dataTable.moment('DD-MM-YYYY HH:mm A');
-  //    $('#datatable').DataTable({
-  //      "paging": true,
-  //      "lengthChange": true,
-  //      "searching": true,
-  //      "ordering": true,
-  //      // "columnDefs" : [{"targets":3, "type":"date-eu"}],
-  //      "aaSorting": [
-  //        [3, "desc"]
-  //      ],
-  //      "info": true,
-  //      "autoWidth": true
+            </div>
 
-  //    });
-  //  });
- </script>
- 
- <script>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary waves-effect"
+                    data-dismiss="modal" value="Cancel">Cancel</button>
+                <button type="button"
+                    class="btn btn-info waves-effect waves-light tempClick" id="tempClick">Submit</button>
+            </div>
+        </div>
+    </div>
+</div><!-- /.modal -->
+<script>
     $(document).ready(function() {
         $("#ccwizard").on("shown.bs.modal", function(e) {
             var id = $(e.relatedTarget).data('id');
@@ -189,9 +169,9 @@
             $('#CostCenterName').val('');
             $('#id').val(id);
             if (id == 0) {
-                $('.modal-title').html("Add CostCenter");
+                $('.modal-title').html("Add Cost Center");
             } else {
-                $('.modal-title').html("Edit CostCenter");
+                $('.modal-title').html("Edit Cost Center");
                 $('#CostCenterName').val(name);
             }
         });
@@ -209,7 +189,7 @@
 
             $.ajax({
                 type: 'POST',
-                url: "<?php echo base_url();?>fetchCostCenterDetails",
+                url: "<?php echo base_url(); ?>fetchCostCenterDetails",
                 data: formData,
                 dataType: 'json',
                 success: function(response) {
@@ -229,83 +209,88 @@
     });
 </script>
 <script>
-$(document).ready(function() {
-    $.fn.dataTable.ext.type.order['date-eu-pre'] = function (date) {
-        var dateSplit = date.split('-');
-        return (dateSplit[2] + dateSplit[1] + dateSplit[0]) * 1;
-    };
-    
-    // Initialize the DataTable
-    var table = $('#cost_listing').DataTable({
-        dom: 'Blfrtip', // Buttons, length menu, filter, table, information, pagination
-        buttons: [
-            'copy', 'csv', 'excel', 'pdf', 'print' // Export buttons
-        ],
-        pageLength: 10, // Default rows per page
-        lengthMenu: [ [10, 20, 30, 50, -1], [10, 20, 30, 50, "All"] ], // Rows per page options
-        responsive: true, // Responsive table
-        order: [[0, 'desc']], // Default ordering (column index 0, descending)
-        language: {
-            paginate: {
-                next: '<i class="fas fa-angle-right"></i>', // Next button icon
-                previous: '<i class="fas fa-angle-left"></i>' // Previous button icon
+    $(document).ready(function() {
+        $.fn.dataTable.ext.type.order['date-eu-pre'] = function(date) {
+            var dateSplit = date.split('-');
+            return (dateSplit[2] + dateSplit[1] + dateSplit[0]) * 1;
+        };
+
+        // Initialize the DataTable
+        var table = $('#cost_listing').DataTable({
+            dom: 'Blfrtip', // Buttons, length menu, filter, table, information, pagination
+            buttons: [
+                'copy', 'csv', 'excel', 'pdf', 'print' // Export buttons
+            ],
+            pageLength: 10, // Default rows per page
+            lengthMenu: [
+                [10, 20, 30, 50, -1],
+                [10, 20, 30, 50, "All"]
+            ], // Rows per page options
+            responsive: true, // Responsive table
+            order: [
+                [0, 'desc']
+            ], // Default ordering (column index 0, descending)
+            language: {
+                paginate: {
+                    next: '<i class="fas fa-angle-right"></i>', // Next button icon
+                    previous: '<i class="fas fa-angle-left"></i>' // Previous button icon
+                }
             }
-        }
-    });
+        });
 
-    // Date range filter function
-    $.fn.dataTable.ext.search.push(
-        function(settings, data, dataIndex) {
-            var fromDate = $('#fromDate').val();
-            var toDate = $('#toDate').val();
-            
-            if (!fromDate || !toDate) {
-                return true; // If no dates selected, don't filter
+        // Date range filter function
+        $.fn.dataTable.ext.search.push(
+            function(settings, data, dataIndex) {
+                var fromDate = $('#fromDate').val();
+                var toDate = $('#toDate').val();
+
+                if (!fromDate || !toDate) {
+                    return true; // If no dates selected, don't filter
+                }
+
+                var dateStr = data[0]; // Assuming the date is in the first column
+                var dateParts = dateStr.split("-");
+                var date = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]); // Convert dd-mm-yyyy to Date object
+
+                var startDate = new Date(fromDate);
+                var endDate = new Date(toDate);
+
+                // Adjust startDate to include the day before the selected fromDate
+                startDate.setDate(startDate.getDate() - 1);
+
+                // Ensure endDate includes the entire end date by setting time to the end of the day
+                endDate.setHours(23, 59, 59, 999);
+
+                // Return true if the date is within the range
+                return date >= startDate && date <= endDate;
             }
-            
-            var dateStr = data[0]; // Assuming the date is in the first column
-            var dateParts = dateStr.split("-");
-            var date = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]); // Convert dd-mm-yyyy to Date object
-            
-            var startDate = new Date(fromDate);
-            var endDate = new Date(toDate);
-            
-            // Adjust startDate to include the day before the selected fromDate
-            startDate.setDate(startDate.getDate() - 1);
-            
-            // Ensure endDate includes the entire end date by setting time to the end of the day
-            endDate.setHours(23, 59, 59, 999);
+        );
 
-            // Return true if the date is within the range
-            return date >= startDate && date <= endDate;
-        }
-    );
+        // Handle form submission for the date range filter
+        $("#DateRangeFilter").submit(function(e) {
+            e.preventDefault();
+            table.draw(); // Redraw the table to apply the filter
+        });
 
-    // Handle form submission for the date range filter
-    $("#DateRangeFilter").submit(function(e) {
-        e.preventDefault();
-        table.draw(); // Redraw the table to apply the filter
+        // Reset button functionality
+        $("#resetButton").click(function() {
+            $("#fromDate").val('');
+            $("#toDate").val('');
+            table.draw(); // Redraw the table to clear the filter
+        });
+
+        // Automatically focus and open the To Date picker when From Date is selected
+        document.getElementById('fromDate').addEventListener('change', function() {
+            var fromDate = this.value;
+            var toDateInput = document.getElementById('toDate');
+
+            // Set the min attribute of the To Date input to the selected From Date
+            toDateInput.min = fromDate;
+
+            // Optionally reset the To Date input if the current value is before the new min date
+            if (toDateInput.value < fromDate) {
+                toDateInput.value = fromDate;
+            }
+        });
     });
-
-    // Reset button functionality
-    $("#resetButton").click(function() {
-        $("#fromDate").val('');
-        $("#toDate").val('');
-        table.draw(); // Redraw the table to clear the filter
-    });
-
-    // Automatically focus and open the To Date picker when From Date is selected
-    document.getElementById('fromDate').addEventListener('change', function() {
-        var fromDate = this.value;
-        var toDateInput = document.getElementById('toDate');
-        
-        // Set the min attribute of the To Date input to the selected From Date
-        toDateInput.min = fromDate;
-
-        // Optionally reset the To Date input if the current value is before the new min date
-        if (toDateInput.value < fromDate) {
-            toDateInput.value = fromDate;
-        }
-    });
-});
 </script>
\ No newline at end of file
diff --git a/app/Views/transporterListing.php b/app/Views/transporterListing.php
index a27c14ad..f105de0f 100644
--- a/app/Views/transporterListing.php
+++ b/app/Views/transporterListing.php
@@ -38,49 +38,42 @@
     }
 </style>
 <style>
-    .modal
-	{
-		padding-right:25% ! important;
-	}
- 	.num{
-		text-align:right;
-	}
-	.modal-content
-	{
-		 width: 800px ! important; 
-	}
-	th {
-    	white-space: nowrap;
-	}
-	.Date-filter-form {
-            display: flex;
-            align-items: center;
-            gap: 10px; /* Adjust the gap as needed */
-        }
-        .Date-filter-form input, .Date-filter-form button {
-            padding: 5px;
-            font-size: 14px;
-        }
-        .Date-filter-form button {
-            background-color: #007bff;
-            color: white;
-            border: none;
-            cursor: pointer;
-        }
-        .Date-filter-form button:hover {
-            background-color: #0056b3;
-        }
-        .icon-button {
-            background: none;
-            border: none;
-            cursor: pointer;
-            color: #007bff;
-            font-size: 18px;
-        }
-        .icon-button:hover {
-            color: #0056b3;
-        }
-	</style>
+    .Date-filter-form {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        /* Adjust the gap as needed */
+    }
+
+    .Date-filter-form input,
+    .Date-filter-form button {
+        padding: 5px;
+        font-size: 14px;
+    }
+
+    .Date-filter-form button {
+        background-color: #007bff;
+        color: white;
+        border: none;
+        cursor: pointer;
+    }
+
+    .Date-filter-form button:hover {
+        background-color: #0056b3;
+    }
+
+    .icon-button {
+        background: none;
+        border: none;
+        cursor: pointer;
+        color: #007bff;
+        font-size: 18px;
+    }
+
+    .icon-button:hover {
+        color: #0056b3;
+    }
+</style>
 
 <div class="content-page">
     <div class="content">
@@ -95,118 +88,119 @@
                         </div>
                     </div>
                     <div class="col-6 text-right">
-                            <a data-toggle="modal" href="#transporterwizard" data-id="0" data-name="" class="btn btn-success">Add New Transporter</a>									</div>
+                        <a data-toggle="modal" href="#transporterwizard" data-id="0" data-name="" class="btn btn-success">Add New Transporter</a>
                     </div>
-
-                </div>  
-                <div class="row">
-                    <div class="col-12">
-                        <div class="card">
-                            <form class="Date-filter-form" id="DateRangeFilter" style="margin-top: 14px;margin-bottom: -11px;margin-left: 33px;">
-                                <input type="hidden"  name="table" value="requisition">
-                                <label for="fromDate">From:</label>
-                                <input class="form-control date_range" type="date" id="fromDate" name="fromDate" placeholder="Select From Date" autocomplete="off" required>
-
-                                <label for="toDate">To:</label>
-                                <input class="form-control date_range" type="date" id="toDate" name="toDate" placeholder="Select To Date" autocomplete="off" required>
-
-                                <button type="submit" class="range_search_button"><i class="fe-search" aria-hidden="true" class="icon-button" title="Search"></i></button>
-                                <i class="fe-rotate-cw range_reset_button" aria-hidden="true" class="icon-button" id="resetButton" title="Reset"></i>
-                                <div class="error" id="error"></div>
-                            </form>
-                            <div class="card-body">
-                                <table id="transporter_list" class="table dt-responsive nowrap w-100">
-                                    <thead>
-                                        <tr>
-                                            <th>Create Date</th>
-                                            <th>Create Time</th>
-                                            <th>Transporter ID</th>
-                                            <th>Transporter Name</th>
-                                            <th>Created By</th>
-                                            <th>Active</th>
-                                            <th>Action</th>
-                                        </tr>
-                                    </thead>
-                                    <tbody>
-                                        <?php
-                                        if (!empty($userRecords)) {
-                                            foreach ($userRecords as $record) {
-                                                $createdat = new DateTime($record->created_on);
-                                                $date = $createdat->format('d-m-Y');
-                                                $time = $createdat->format('h:i A');
-                                        ?>
-                                                <tr>
-                                                    <td><?php echo $date; ?></td>
-                                                    <td><?php echo $time; ?></td>
-                                                    <td><?php echo $record->id ?></td>
-                                                    <td><?php echo $record->name ?></td>
-                                                    <td><?php echo $record->FirstName ?></td>
-                                                    <td><?php
-                                                        $a = '';
-                                                        $a = $record->isactive == 1 ?  'ACTIVE' : 'INACTIVE';
-                                                        echo $a;
-                                                        ?></td>
-                                                    <td>
-                                                        <a data-toggle="modal" href="#transporterwizard" data-id="<?php echo $record->id; ?>" data-name="<?php echo $record->name; ?>"><i class="fa fa-pencil"></i></a>
-                                                        <?php if ($record->isactive == 1) { ?>
-                                                            <a href="<?php echo base_url() . 'deleteTransporter?id=' . $record->id; ?>"><i class="fa fa-trash"></i>&nbsp;&nbsp;&nbsp;</a>
-                                                        <?php } ?>
-                                                    </td>
-                                                </tr>
-                                        <?php
-                                            }
-                                        }
-                                        ?>
-                                    </tbody>
-
-                                </table>
-
-                            </div> <!-- end card body-->
-                        </div> <!-- end card -->
-                    </div><!-- end col-->
                 </div>
+
             </div>
+            <div class="row">
+                <div class="col-12">
+                    <div class="card">
+                        <form class="Date-filter-form" id="DateRangeFilter" style="margin-top: 14px;margin-bottom: -11px;margin-left: 33px;">
+                            <input type="hidden" name="table" value="requisition">
+                            <label for="fromDate">From:</label>
+                            <input class="form-control date_range" type="date" id="fromDate" name="fromDate" placeholder="Select From Date" autocomplete="off" required>
+
+                            <label for="toDate">To:</label>
+                            <input class="form-control date_range" type="date" id="toDate" name="toDate" placeholder="Select To Date" autocomplete="off" required>
+
+                            <button type="submit" class="range_search_button"><i class="fe-search" aria-hidden="true" class="icon-button" title="Search"></i></button>
+                            <i class="fe-rotate-cw range_reset_button" aria-hidden="true" class="icon-button" id="resetButton" title="Reset"></i>
+                            <div class="error" id="error"></div>
+                        </form>
+                        <div class="card-body">
+                            <table id="transporter_list" class="table dt-responsive nowrap w-100">
+                                <thead>
+                                    <tr>
+                                        <th>Create Date</th>
+                                        <th>Create Time</th>
+                                        <th>Transporter ID</th>
+                                        <th>Transporter Name</th>
+                                        <th>Created By</th>
+                                        <th>Active</th>
+                                        <th>Action</th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    <?php
+                                    if (!empty($userRecords)) {
+                                        foreach ($userRecords as $record) {
+                                            $createdat = new DateTime($record->created_on);
+                                            $date = $createdat->format('d-m-Y');
+                                            $time = $createdat->format('h:i A');
+                                    ?>
+                                            <tr>
+                                                <td><?php echo $date; ?></td>
+                                                <td><?php echo $time; ?></td>
+                                                <td><?php echo $record->id ?></td>
+                                                <td><?php echo $record->name ?></td>
+                                                <td><?php echo $record->FirstName ?></td>
+                                                <td><?php
+                                                    $a = '';
+                                                    $a = $record->isactive == 1 ?  'ACTIVE' : 'INACTIVE';
+                                                    echo $a;
+                                                    ?></td>
+                                                <td>
+                                                    <?php if ($record->isactive == 1) { ?>
+                                                        <a data-toggle="modal" href="#transporterwizard" data-id="<?php echo $record->id; ?>" data-name="<?php echo $record->name; ?>"><i class="fa fa-pencil"></i></a>
+                                                        <a href="<?php echo base_url() . 'deleteTransporter?id=' . $record->id; ?>"><i class="fa fa-trash"></i>&nbsp;&nbsp;&nbsp;</a>
+                                                    <?php } ?>
+                                                </td>
+                                            </tr>
+                                    <?php
+                                        }
+                                    }
+                                    ?>
+                                </tbody>
+
+                            </table>
+
+                        </div> <!-- end card body-->
+                    </div> <!-- end card -->
+                </div><!-- end col-->
+            </div>
+
         </div> <!-- container -->
     </div> <!-- content -->
 </div>
 
-        <!-- for Add and edit Modal -->
-        <div id="transporterwizard" class="modal fade" tabindex="-1" role="dialog"
-			aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
-			<div class="modal-dialog">
-				<div class="modal-content">
-					<div class="modal-header">
-						<h4 class="modal-title"></h4>
-						<button type="button" class="close" data-dismiss="modal"
-							aria-hidden="true">×</button>
-					</div>
-					<div class="modal-body p-4">
-                    <form id="transporterForm" class="form-horizontal" role="form">
-                          <div class="form-group">
-                              <div class="row">
-                                  <div class="col-md-4 col-md-offset-2">
-                                    Transporter Name:
-                                  </div>
-                                  <div class="col-md-6">
-                                      <input type="text" name="transportername" id="transportername" class="form-control">
-                                      <input type="hidden" name="transporterid" id="transporterid" class="form-control">
-                                  </div>
-                              </div>
-                          </div>
-                      </form>
+<!-- for Add and edit Modal -->
+<div id="transporterwizard" class="modal fade" tabindex="-1" role="dialog"
+    aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h4 class="modal-title"></h4>
+                <button type="button" class="close" data-dismiss="modal"
+                    aria-hidden="true">×</button>
+            </div>
+            <div class="modal-body p-4">
+                <form id="transporterForm" class="form-horizontal" role="form">
+                    <div class="form-group">
+                        <div class="row">
+                            <div class="col-md-4 col-md-offset-2">
+                                Transporter Name:
+                            </div>
+                            <div class="col-md-6">
+                                <input type="text" name="transportername" id="transportername" class="form-control">
+                                <input type="hidden" name="transporterid" id="transporterid" class="form-control">
+                            </div>
+                        </div>
+                    </div>
+                </form>
 
-					</div>
+            </div>
 
-					<div class="modal-footer">
-						<button type="button" class="btn btn-secondary waves-effect"
-							data-dismiss="modal" value="Cancel">Cancel</button>
-						<button type="button"
-							class="btn btn-info waves-effect waves-light tempClick" id="tempClick">Submit</button>
-					</div>
-				</div>
-			</div>
-		</div><!-- /.modal -->
-        <script>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary waves-effect"
+                    data-dismiss="modal" value="Cancel">Cancel</button>
+                <button type="button"
+                    class="btn btn-info waves-effect waves-light tempClick" id="tempClick">Submit</button>
+            </div>
+        </div>
+    </div>
+</div><!-- /.modal -->
+<script>
     $(document).ready(function() {
         $("#transporterwizard").on("shown.bs.modal", function(e) {
             var id = $(e.relatedTarget).data('id');
@@ -234,7 +228,7 @@
 
             $.ajax({
                 type: 'POST',
-                url: "<?php echo base_url();?>fetchTransporterDetails",
+                url: "<?php echo base_url(); ?>fetchTransporterDetails",
                 data: formData,
                 dataType: 'json',
                 success: function(response) {
@@ -253,78 +247,83 @@
         });
     });
 
-$(document).ready(function() {
-    // Initialize the DataTable
-    var table = $('#transporter_list').DataTable({
-        dom: 'Blfrtip', // Buttons, length menu, filter, table, information, pagination
-        buttons: [
-            'copy', 'csv', 'excel', 'pdf', 'print' // Export buttons
-        ],
-        pageLength: 10, // Default rows per page
-        lengthMenu: [ [10, 20, 30, 50, -1], [10, 20, 30, 50, "All"] ], // Rows per page options
-        responsive: true, // Responsive table
-        order: [[0, 'desc']], // Default ordering (column index 0, descending)
-        language: {
-            paginate: {
-                next: '<i class="fas fa-angle-right"></i>', // Next button icon
-                previous: '<i class="fas fa-angle-left"></i>' // Previous button icon
+    $(document).ready(function() {
+        // Initialize the DataTable
+        var table = $('#transporter_list').DataTable({
+            dom: 'Blfrtip', // Buttons, length menu, filter, table, information, pagination
+            buttons: [
+                'copy', 'csv', 'excel', 'pdf', 'print' // Export buttons
+            ],
+            pageLength: 10, // Default rows per page
+            lengthMenu: [
+                [10, 20, 30, 50, -1],
+                [10, 20, 30, 50, "All"]
+            ], // Rows per page options
+            responsive: true, // Responsive table
+            order: [
+                [0, 'desc']
+            ], // Default ordering (column index 0, descending)
+            language: {
+                paginate: {
+                    next: '<i class="fas fa-angle-right"></i>', // Next button icon
+                    previous: '<i class="fas fa-angle-left"></i>' // Previous button icon
+                }
             }
-        }
-    });
+        });
 
-    // Date range filter function
-    $.fn.dataTable.ext.search.push(
-        function(settings, data, dataIndex) {
-            var fromDate = $('#fromDate').val();
-            var toDate = $('#toDate').val();
-            
-            if (!fromDate || !toDate) {
-                return true; // If no dates selected, don't filter
+        // Date range filter function
+        $.fn.dataTable.ext.search.push(
+            function(settings, data, dataIndex) {
+                var fromDate = $('#fromDate').val();
+                var toDate = $('#toDate').val();
+
+                if (!fromDate || !toDate) {
+                    return true; // If no dates selected, don't filter
+                }
+
+                var dateStr = data[0]; // Assuming the date is in the first column
+                var dateParts = dateStr.split("-");
+                var date = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]); // Convert dd-mm-yyyy to Date object
+
+                var startDate = new Date(fromDate);
+                var endDate = new Date(toDate);
+
+                // Adjust startDate to include the day before the selected fromDate
+                startDate.setDate(startDate.getDate() - 1);
+
+                // Ensure endDate includes the entire end date by setting time to the end of the day
+                endDate.setHours(23, 59, 59, 999);
+
+                // Return true if the date is within the range
+                return date >= startDate && date <= endDate;
             }
-            
-            var dateStr = data[0]; // Assuming the date is in the first column
-            var dateParts = dateStr.split("-");
-            var date = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]); // Convert dd-mm-yyyy to Date object
-            
-            var startDate = new Date(fromDate);
-            var endDate = new Date(toDate);
-            
-            // Adjust startDate to include the day before the selected fromDate
-            startDate.setDate(startDate.getDate() - 1);
-            
-            // Ensure endDate includes the entire end date by setting time to the end of the day
-            endDate.setHours(23, 59, 59, 999);
+        );
 
-            // Return true if the date is within the range
-            return date >= startDate && date <= endDate;
-        }
-    );
+        // Handle form submission for the date range filter
+        $("#DateRangeFilter").submit(function(e) {
+            e.preventDefault();
+            table.draw(); // Redraw the table to apply the filter
+        });
 
-    // Handle form submission for the date range filter
-    $("#DateRangeFilter").submit(function(e) {
-        e.preventDefault();
-        table.draw(); // Redraw the table to apply the filter
+        // Reset button functionality
+        $("#resetButton").click(function() {
+            $("#fromDate").val('');
+            $("#toDate").val('');
+            table.draw(); // Redraw the table to clear the filter
+        });
+
+        // Automatically focus and open the To Date picker when From Date is selected
+        document.getElementById('fromDate').addEventListener('change', function() {
+            var fromDate = this.value;
+            var toDateInput = document.getElementById('toDate');
+
+            // Set the min attribute of the To Date input to the selected From Date
+            toDateInput.min = fromDate;
+
+            // Optionally reset the To Date input if the current value is before the new min date
+            if (toDateInput.value < fromDate) {
+                toDateInput.value = fromDate;
+            }
+        });
     });
-
-    // Reset button functionality
-    $("#resetButton").click(function() {
-        $("#fromDate").val('');
-        $("#toDate").val('');
-        table.draw(); // Redraw the table to clear the filter
-    });
-
-    // Automatically focus and open the To Date picker when From Date is selected
-    document.getElementById('fromDate').addEventListener('change', function() {
-        var fromDate = this.value;
-        var toDateInput = document.getElementById('toDate');
-        
-        // Set the min attribute of the To Date input to the selected From Date
-        toDateInput.min = fromDate;
-
-        // Optionally reset the To Date input if the current value is before the new min date
-        if (toDateInput.value < fromDate) {
-            toDateInput.value = fromDate;
-        }
-    });
-});
 </script>
\ No newline at end of file