Click on button the database status/checkout time should be updated in php

Further checking I have noticed that if there is more than 1 record "check-out’ button is not working

I think XMLHttpRequest on the main thread is deprecated warning is because I am adding jquery in crud.php.
but finally I have a solution to remove this warning and get workable checkout button just insert the ajax call into your $output variable at end will solve XMLHttpRequest issue and when i tried below code with 4 records chackout button is working correctly :

<?php
 class Crud
{
 //crud class
 public $connect;
 private $host = 'localhost';
 private $username = 'root';
 private $password = '';
 private $database = 'database';

 function __construct()
 {
  $this->database_connect();
 }

 public function database_connect()
 {
  $this->connect = mysqli_connect($this->host, $this->username, $this->password, $this->database);
 }

 public function execute_query($query)
 {
  return mysqli_query($this->connect, $query);
 }

 public function get_data_in_table($query)
 {
  $output = '';
  $result = $this->execute_query($query);
  $output .= '
  <table class="table table-bordered table-striped">
   <tr style="font-family:arial; font-size:13px; font-weight:normal; color:#363A41; background-color:#8ea9db;">
  <!-- <th width="1%"  style="text-align:center; vertical-align:middle; "><input type="checkbox" id="select_all" name="select_all" onClick="selectAll()"></th>-->
 <th width="4%" style="text-align:center; vertical-align:middle; font-family: Arial, Helvetica, sans-serif;">ID</th>
   <th width="10%" style="text-align:center; vertical-align:middle;">Full Name</th>

    <!--<th width="14%" style="text-align:center; vertical-align:middle;">Address</th>-->
<th width="10%" style="text-align:center; vertical-align:middle;">Guest House Name</th>
<th width="10%" style="text-align:center; vertical-align:middle;">Room No</th>
<!--<th width="10%" style="text-align:center; vertical-align:middle;">Date &Time</th>-->
<th width="10%" style="text-align:center; vertical-align:middle;">Check In</th>
<th width="10%" style="text-align:center; vertical-align:middle;">Check Out</th>
<th width="10%" style="text-align:center; vertical-align:middle;">Date To</th>
  <!-- <th width="6%" style="text-align:center; vertical-align:middle;">Alert</th>-->
   <th width="6%" style="text-align:center; vertical-align:middle;">Payment</th>
<th width="6%" style="text-align:center; vertical-align:middle;">Discount</th>

<th width="6%" style="text-align:center; vertical-align:middle;">Checkout</th>
   <th width="6%" style="text-align:center; vertical-align:middle;">Print</th>


   </tr>
  ';
  if(mysqli_num_rows($result) > 0)
  {
   while($row = mysqli_fetch_object($result))
   {
     $time = new DateTime($row->date_add);
     $date = $time->format('d-m-Y');
     $time = $time->format("g"). '.' .$time->format("i"). ' ' .$time->format("A");//this line for to convert into  analog with am or pm
     $check_in = $row->check_in;
     if ($check_in == '0000-00-00 00:00:00') {
       $check_in = '';
     }else{
     $check_in = new DateTime($row->check_in);
       $check_in_date = $check_in->format('d-m-Y');
       $check_in_time = $check_in->format("g"). '.' .$check_in->format("i"). ' ' .$check_in->format("A");
       $check_in= "$check_in_date" . " " . "$check_in_time";
     }

     $check_out= $row->check_out;
    if($check_out == '0000-00-00 00:00:00'){
       $check_out = '';
     }else {
       $check_out = new DateTime($row->check_out);
       $check_out_date = $check_out->format('d-m-Y');
       $check_out_time = $check_out->format("g"). '.' .$check_out->format("i"). ' ' .$check_out->format("A");
       $check_out = "$check_out_date" . " ". "$check_out_time";
     }
     $date_too =  $row->date_too;
     if($date_too == '0000-00-00 00:00:00'){
        $date_too = '';}
        else {
          $date_too =  strtotime($row->date_too);
          $date_too = date('d-m-Y', $date_too);
        }

    $output .= '
    <tr >
<tr style="font-family:arial; font-size:13px; font-weight:normal; color:#363A41;">
    <!-- <td style=" text-align:center; vertical-align:middle;"><input type="checkbox" class="emp_checkbox" ></td>-->
     <td style="text-align:center; vertical-align:middle;">'.$row->id_order.'</td>
  <td style="text-align:center; vertical-align:middle; ">'.$row->customer.'</td>
      <!--  <td style="text-align:center; vertical-align:middle;">'.$row->address1.'&nbsp'.$row->address2.'&nbsp'.$row->postcode.'&nbsp'.$row->city.'</td>-->
   <td style=" text-align:center; vertical-align:middle; ">'.$row->hotel_name.'</td>
   <td style="text-align:center; vertical-align:middle; ">'.$row->Room.'</td>
<!--<td style="text-align:center; vertical-align:middle;">'.$date .'&nbsp'.$time .'</td>-->
<td style="text-align:center; vertical-align:middle;">'.$check_in.'</td>
<td style="text-align:center; vertical-align:middle;">'.$check_out.'</td>
<td style="text-align:center; vertical-align:middle;">'.$date_too.'</td>
<!--<td style="text-align:center; vertical-align:middle; "></td>-->
<td style="text-align:center; vertical-align:middle;">'.number_format($row->total_products_wt, 2).'</td>
<td style="text-align:center; vertical-align:middle;">'.number_format($row->total_discount_tax_incl, 2).'</td>

<td style="text-align:center; vertical-align:middle;"><span class="btn btn-success btn-xs"><div style="color: white;" class="link" data='.$row->id_order.' >Check-out</div></span></td>
      <td style="text-align:center; vertical-align:middle;"><span class="btn btn-success btn-xs"><a style="color: white;" href=./slip.php?id='.$row->id_order.' target="_blank">Print</a></span></td>

    </tr>
    ';
   }
  }
  else
  {
   $output .= '
    <tr>
     <td colspan="11" align="center">No Data Found</td>
    </tr>
   ';
  }
  $output .= '</table><div id="display"></div><script>
 $(document).ready(function(){
	$(".link").click(function(){
		var id=$(this).attr("data");
		$.ajax({ 
			url:"update.php",
			method:"GET",
			data:{id:id},
			success:function(data){
				$("#display").html(data);
			}
		})
	})
 })
</script>';
  return $output;
 }

function upload_file($file)
 {
  if(isset($file))
  {
    $extension = explode('.', $file["name"]);
    $new_name = $extension[0] . '.' . $extension[1];
    $destination = './upload/' . $new_name;
    move_uploaded_file($file['tmp_name'], $destination);
    return $new_name;
  }
}

function make_pagination_link($query, $record_per_page)
 {
  $output = '';

  $result = $this->execute_query($query);
  $total_records = mysqli_num_rows($result);
  $total_pages = ceil($total_records/$record_per_page);

  for($i=1; $i<=$total_pages; $i++){
   $output .= '<span class="curPage" class="pagination_link" id="pagination_link" style="cursor:pointer; padding:6px; border:1px solid #ccc;" submission_id="'.$i.'">'.$i.'</span>';
 }
  return $output;
 }
}
?>


Thank you. I have updated the same above code. this only works for 1 button (record) only. For other records, button wont work. I have checked in different browser.

sorry!
the mistake was mine .I forget to tell you to change id="link" for checkout button to class="link". since we can not give same id to many elements .
in ajax call use .link instead of #link.
and to see the result just change
$record_per_page=1 in your action.php . and you find it work for all checkout buttons.
since it is returning the same value for all checkout button so you couldn’t able to see the result.

WOW. Now working like a charm. Thank you very much for your full support to fixing the issue.