Get value from table when clicking on a button - php

Question

I have a table there is showing some values. In each row there is a Order_ID and a button.
How can i get my value in $Order_ID to show (alert) when clicking on a button?
<tbody>
<?php
foreach($menuextra_result as $transaction)
{
?>
<tr>
$order_id = isset($transaction['order_id'])?($transaction['order_id']) :"";
?>
<?php if($order_id){ ?>
<td><div id="orderID"><?= $order_id ?></a></td>
<?php } else {?>
<td><div ><span style="color:red">MANGLER</span></td>
<?php }?>
style="color:red">MISSING</span></td>
<?php }?>
//There's more here, but did not bother to show it, because it was irrelevant.
<td><input type="submit" onclick="getElementById" value="Yes "></td>
<?php }
?>
</tr>
<?php
}
?>
</tbody>
This is how i tried
<script type="text/javascript">
function getElementById()
{
el = document.getElementById('order_id');
alert(el);
}
</script>
But when clicking on a button, nothing happens

Answer 1

table.php
//assuming you have done you loop work
<table>
<tr>
<td>
<?php echo $row['name']?>
</td>
<td><input type="button" value="click me" onclick="clickMe(<?php echo $row['id']?>)" /></td>
</tr>
</table>
clickme unction is like this
function clickMe(id) {
alert(id);
}
You will pass one parameter to clickMe() function and the parameter is id

Answer 2

First of all, don't use id as you have more than one such element. You can use class instead:
<div class="orderID"><?= $order_id ?></div>
Also fixed invalid HTML you got, closing tag for <div> is </div> and not </a>.
Second, change the click to send the button to the function:
<input type="submit" onclick="FindOrder(this);" value="Yes " />
And finally this function should do the trick: (by searching for "brother" div)
function FindOrder(oButton) {
var oRow = oButton.parentNode;
while (oRow && oRow.tagName.toLowerCase() !== "tr")
oRow = oRow.parentNode;
var arrDivs = oRow.getElementsByTagName("div");
var orderDiv = null;
for (var i = 0; i < arrDivs.length; i++) {
if (arrDivs[i].className === "orderID") {
orderDiv = arrDivs[i];
break;
}
}
if (orderDiv != null) {
var orderNumber = orderDiv.innerHTML;
alert("order is " + orderNumber);
} else {
alert("order not found");
}
}
Live test case.

Answer 3

You'll need to print the $order_id to your HTML somewhere. You could use hidden input:
<input name="order_id" id="order_id" value="<?php echo $order_id; ?>">
Then you can submit form or grab the value.

Answer 4

You can't getElementById from you web page if it does not exist.
So solution is simple, just add an hidden input element on your table. You can get the id from your script.
<tbody>
<?php
foreach($menuextra_result as $transaction)
{
?>
<tr>
<?php
$order_id = isset($transaction['order_id'])?($transaction['order_id']) :"";
?>
//There's more here, but did not bother to show it, because it was irrelevant.
<td>
<input type="hidden" name="order_id" id="order_id" value="<?php echo $order_id;?>">
<input type="submit" onclick="getElementById" value="Yes "></td>
<?php }
?>
</tr>
<?php
}
?>
</tbody>