Forward_Station_Server/api/v1/UpdatePrices/updatePricesView.php

<div class="container-fluid">
    <div class="row">
    <div class="col-sm-6">
<button class="btn btn-primary" onclick="document.getElementById('editStatus').style.display = 'none';"> Add Prices Update </button>
<table id="updatePrices" class="table display table-striped table-bordered table-hover table-sm" cellspacing="0" width="100%">
  <thead>
        <tr>
            <th></th>
            <th>Id</th>
            <th>Status</th>
            <th>Timing</th>
            <th>Create At</th>
            <th>Update At</th>
        </tr>
  </thead>

    <!-- <tfoot>
        <tr>
            <th></th>
            <th>Id</th>
            <th>Status</th>
            <th>Timing</th>
            <th>Create At</th>
            <th>Update At</th>
        </tr>
    </tfoot> -->
</table>
    </div>

    <div class="col-sm-6">
    <!-- <input type="number" name="" id="loadVehicles"> -->
    <?php include "fuelPricesData.php" ?>
    <?php include "fuelPricesView.php" ?>
    </div>

    </div>
</div>
<?php include "EditStatus.php" ?>
<script type="text/javascript">
$(document).ready(function() {
    var table = $('#updatePrices').DataTable( {
        //"buttons": true,
        "ajax": "api/v1/UpdatePrices/updatePricesData.txt",
        "columns": [
            {
                "className":      'edit',
                "orderable":      false,
                "data":           null,
                "defaultContent": 'Edit'
            },
            { "data": "Id"},
            { "data": "Status" },
            { "data": "Timing" },
            { "data": "Create_At" },
            { "data": "Update_At" },
        ],
        "order": [[1, 'asc']],
        select: true
    } );

        // Add event listener for opening and closing details
    $('#updatePrices tbody').on('click', 'tr td.edit', function () {
        var tr = $(this).closest('tr');
        var row = table.row( tr );

        var id = row.data()['Id'];
        var status= row.data()['Status'];

        // var id = table.row( this ).data()['Id'];
        document.getElementById('id').value = id;
        document.getElementById('status').value = status;

        document.getElementById('editStatus').style.display = 'block';
    } );

    $('#updatePrices tbody').on('click', 'tr', function () {
        var tr = $(this).closest('tr');
        var row = table.row( tr );

        alert(row.data()['Id']);
        document.cookie = "updatePricesId="+row.data()['Id'];
        // document.cookie = "customerName="+row.data()['Id'];
        //window.location.href = 'index.php';
        //open_script();
    } );
    
} );
function open_script(){
   window.location.assign('/updatePricesData.php');//there are many ways to do this
}
</script>