looping through hidden fields within a php while loop that are in a table row

How do I know which hidden field I should fetch a value from given a button clicked that is adjacent to the hidden fields. this button is also in the while loop hence giving rise to a list of buttons and hidden fields. each button has a hidden field adjacent to it.

I want to use jquery ajax to insert data from the hidden field into a table in the DB but wen i loop through all the buttons to find out which one is clicked, it works well but the problem comes in wen i loop through the hidden fields, it gets the value of the last hidden field. How do i get the value of the hidden field just adjacent to the button that was clicked? I will really appreciate the help. Thanx in advance.

<Table id="list_tb">
<?php
while($rows=mysql_fetch_assoc(orderSQL))
{
?>
<tr>
<td><?php echo $rows['name'];?></td>
<td开发者_如何转开发>
<form>
<input type="submit" name="add_btn" id="add_btn" value="Add"/>
<input type="hidden" name="order_id" id="order_id" value="<?php echo $rows['order_id'];?>"/>
</form
</td>
</tr>
<?php
}
?>
</Table>

THE JQUERY

$(#list_tb input[type=submit]).each(function(){
$(this).click(function(){
$(#list_tb input[type=hidden]).each(function(){
var value=$(this).val();
alert(value);
});
});
});

---

say your html like this

<div id="parent">
    <div class="child">
        <span><input type="hidden" class="hid" value="1"></span>
        <span><input type="button" class="but" value="submit"></span>
    </div>
    <div class="child">
        <span><input type="hidden" class="hid" value="3"></span>
        <span><input type="button" class="but" value="submit"></span>
    </div>
</div>

Jquery code like this

jQuery(".but").click(function(){
    var hidVal  =   jQuery(this).closest("div.child").find("hid").val();
});

---

i am just picking the html given by Harish....you can do in this way also..

<div id="parent">
<div class="child">
    <span><input type="hidden" class="hid" value="1"></span>
    <span><input type="button" class="but" value="submit"></span>
</div>
<div class="child">
    <span><input type="hidden" class="hid" value="3"></span>
    <span><input type="button" class="but" value="submit"></span>
</div>

and jquery will be..

jQuery(".but").click(function(){
  var hidVal  =   jQuery(this).parents("div.child").find("hid").val();
 });

---

Thanx guyz, I got to solve it, its a long short but it worked, for anyone who needs this code, this is how it goes

  <form id="form1" name="form1" method="post" action="load_modules.php">  
  <table width="500" id="orderlist_table">
    <tr>
      <th width="78" style="font-size: 12px">type</th>
      <th width="82" style="font-size: 12px">amount</th>
      <th width="90" style="font-size: 12px">date</th>
      <th colspan="5" style="font-size: 12px">invoice order</th>
    </tr>
    <?php

        while($order_rows=mysql_fetch_assoc($orderSQL))
        {
        ?>
    <tr>
      <td height="26" style="font-size: 12px"><?php echo $order_rows['Type']; ?></td>
      <td style="font-size: 12px"><?php echo $order_rows['Total_amount']; ?></td>
      <td style="font-size: 12px"><?php echo $order_rows['Date']; ?></td>
      <td width="55" id="invoice_btn_td" style="font-size: 12px">
      <input type="submit" name="invoice_btn" id="hf<?php echo $order_rows['id'];?>" value="invoice"/>
      </td>
      <td width="30" id="userid_td" style="font-size: 12px">
      <input type="hidden" name="user_idhf" id="hf<?php echo $order_rows['id'];?>" value="<?php echo $order_rows['User_id']; ?>" />
      </td>
      <td width="35" id="type_td" style="font-size: 12px" >
      <input type="hidden" name="typehf" id="hf<?php echo $order_rows['id'];?>" value="<?php echo $order_rows['Type'];?>" />
      </td>
      <td width="37" id="order_td" style="font-size: 12px">
      <input type="hidden" name="orderidhf" id="hf<?php echo $order_rows['id'];?>" value="<?php echo $order_rows['id'];?>" />
      </td>
      <td width="57" id="amount_td" style="font-size: 12px">
      <input type="hidden" name="total_amounthf" id="hf<?php echo $order_rows['id'];?>" value="<?php echo $order_rows['Total_amount']?>" />
      </td>
    </tr>
    <?php
        }
        ?>
  </table>

jQuery:

$("#orderlist_table input[type=submit]").each(function(){
    $(this).click(function(){
        var btn_id=$(this).attr('id');
        var userid_value;
        var type_value;
        var orderid_value;
        var totalamount_value;
        $("#userid_td input[type=hidden]").each(function(){
                var userid_id=$(this).attr('id');
                if(userid_id==btn_id)
                {
                    userid_value=$(this).attr('value');
                }
        });
        $("#type_td input[type=hidden]").each(function(){
                var type_id=$(this).attr('id');
                if(type_id==btn_id)
                {
                    type_value=$(this).attr('value');
                }
        });
        $("#order_td input[type=hidden]").each(function(){
                var order_id=$(this).attr('id');
                if(order_id==btn_id)
                {
                    orderid_value=$(this).attr('value');
                }
        });
        $("#amount_td input[type=hidden]").each(function(){
                var amount_id=$(this).attr('id');
                if(amount_id==btn_id)
                {
                    totalamount_value=$(this).attr('value');
                }
        });
        //alert(userid+" "+type_value+" "+orderid_value+" "+totalamount_value);
        $.post("php_files/add_invoice.php",{user_idhf:userid_value,
        typehf:type_value,
        orderidhf:orderid_value,
        total_amounthf:totalamount_value},
        function(data)
            {
                if(data.success)
                {
                    alert(data.success);
                }
                if(!data.success)
                {
                    alert(!data.success);
                }
            },'json');
        return false;
    });


});

Just give the button the same name as the hidden fields with a counter number at the end to differntiate them then equate the name of the clicked button to the hidden fields, if they are equal then they are on the same row or rather adjacent to each other. Thats it.

Thanx guyz