javascript - How to get the value from other page

Question

I used $_POST to get the value of order_id but it didn't quiet get right away. I need first to click Button "Show Food" or any button (As seen in the photo below) to popup the table I want to output. And I tried using if(isset($_SESSION['viewOrder'])) to get the value of button in order.php but it didn't get it in ordermodal even I use SESSION. How can I get the value of button viewOrder?

if I change the WHERE order_id=$order_id to WHERE order_id=724 it will popup right away the value of that number (724) BUT it is the output of ALL my order in the food table. So my problem is how can I output the right output for specific order_id?

Example I have 2 order order_id 1 and order_id 2, the value of 1 is burger and pizza and the value of 2 is salad and sandwich , So when I click order_id 1(View Order button in order.php) the value of that food table is burger and pizza only and then when I click the order_id 2 (View Order button in order.php) the value should be salad and sandwich not burger and pizza.

I hope you understand my explanation and I hope for your help guys, I really need to solve this right away. I stacked at this problem couple of days already. Really appreciate your help guys. Big Thanks!

This is my error

This is what I get when clicking a button inside the ordermodal.php

This is my code for order.php .

<button type="button" 
<?php if($order['order_status'] == 'Dispatched'){ ?> input style="background-color:#ffff00;color:black"
 <?php } else if($order['order_status'] == 'Accepted'){ ?> input style="background-color:#0000ff;color:white" <?php } else if($order['order_status'] == 'Pending'){ ?> input style="background-color:#B0C4DE;color:black" { <?php } ?>
 class="btn btn-success" data-toggle="modal" data-target="#myModal" onclick="viewOrder( '<?= $order['order_id'] ?>', '<?= $order['order_id'] ?>', '<?= $order['user_id'] ?>', '<?= $date ?>', '<?= $time ?>', '<?= $order['order_deliveryCharge'] ?>', '<?= $order['order_totalAmount'] ?>', '<?= $order['address'] ?>', '<?= $order['coordinates'] ?>', '<?= $order['driver_number'] ?>', '<?= $order['order_status'] ?>')"> View Order </button>

<script>
 function viewOrder(order_id, order_id, user_id, order_date, order_time, order_deliveryCharge, order_totalAmount, address, coordinates, driver_number, order_status) { 
 document.getElementById("titleModal").innerHTML = "Order Information";
 document.getElementsByName("ORDER_ID")[0].setAttribute("value", order_id); 
 document.getElementsByName("ORDER_ID_MODAL_2")[0].setAttribute("value", order_id);
 document.getElementsByName("user_id")[0].setAttribute("value", user_id);
 document.getElementsByName("order_date")[0].setAttribute("value", order_date); 
 document.getElementsByName("order_time")[0].setAttribute("value", order_time); 
 document.getElementsByName("order_deliveryCharge")[0].setAttribute("value", order_deliveryCharge); 
 document.getElementsByName("order_totalAmount")[0].setAttribute("value", order_totalAmount); 
 document.getElementsByName("address")[0].setAttribute("value", address);
 document.getElementsByName("coordinates")[0].setAttribute("value", coordinates); 
 document.getElementsByName("drivers_number")[0].setAttribute("value", driver_number); 
 document.getElementsByName("order_status")[0].setAttribute("value", order_status);  
 document.getElementsByName("viewOrder")[0].setAttribute("name", "viewOrder");

 }
 </script>

And this is my code for ordermodal.php

<div class="form-group">
 <label for="order_id" class="col-sm-2 control-label">Order ID</label>
 <div class="col-lg-3"> 
 <input type="text" input style="width:500px" class="form-control" name="ORDER_ID" id="ORDER_ID" placeholder="" value="" required="required" readonly> 
</div>
</div>

 <?php 

if(isset($_POST['ORDER_ID'])){  
$order_id = trim(addslashes($_POST['ORDER_ID']));
$sql = "SELECT food_name, special_request, quantity, amount 
FROM cart_tbl
WHERE order_id=$order_id";
$result = mysqli_query(connection2(), $sql);}
?>
<table class="table table-hover table-bordered">
 <thead>
 <tr> 
 <th>Food</th>
 <th>Special Request</th>
 <th>Quantity</th>
 <th>Amount</th> 
 </tr>
 </thead> 
 <?php
if(mysqli_num_rows($result)>0)
{
    while($row = mysqli_fetch_array($result))
    {
?>
<tr>
<td><?php echo $row["food_name"];?></td>
<td><?php echo $row["special_request"];?></td>
<td><?php echo $row["quantity"];?></td>
<td><?php echo $row["amount"];?></td>
</tr>
<?php
    }
}
?>

</table>
 </div>
 <div class="modal-footer">
<button type="submit" input style="background-color:##FF0000;color:white;float:left" name="showFood" id="showFood" class="btn btn-primary " onclick="if(!confirm('Are you sure you want to see food order?')){return false;}" > Show Food</button>
<button type="submit" input style="background-color:#4CAF50;color:white" name="submitDelivered" id="submitDelivered" class="btn btn-primary " onclick="if(!confirm('Are you sure you want to deliver order?')){return false;}" > Delivered </button>
<button type="submit" input style="background-color:#0000FF;color:white" name="submitAccept" id="submitAccept" class="btn btn-primary" onclick="if(!confirm('Are you sure you want to accept order?')){return false;}"> Accept </button>
 <button type="button" style="background-color:#FFFF00;color:black" class="btn btn-success" data-toggle="modal" data-target="#myDropdown"> Send </button> 
 <button type="submit" input style="background-color:#f44336;color:white" name="submitCancel" class="btn btn-danger" onclick="if(!confirm('Are you sure you want to cancel order?')){return false;}">Cancel</button> 

Answer 1

Change this line

document.getElementsByName("ORDER_ID")[0].setAttribute("value", order_id);

To

document.getElementsByName("ORDER_ID")[1].setAttribute("value", order_id);