Hello guys, i have the following script which adds new rows dynamically on clicking button with id of ‘add_row_btn’. Every row added has select option which fetches information from mysql and loads them in the option values.
My problem comes in the part of the script which i have commented out. Every option selected should display its value to its next respective textbox.
Note that the every row added, has a different class name to the previous with the addition of an increment variable (i) at the end.
Any assistance is welcome. Thanks.
[php]$(document).ready(function(){
var i=1;
$("#add_row_btn").on(‘click’,function(){
$(’#addr’+i).html("
"+ (i+1) +" | <?php $order_qry = $conn->prepare('select kit_menu_key, kit_menu_name from kitchen_menu order by kit_menu_name'); $order_qry->execute(); $order_q = $order_qry->fetchAll(); ?> –select– <?php foreach($order_q as $row){?> <option value=’<?php echo $row['kit_menu_key']; ?>’><?php echo $row['kit_menu_key']; ?> <?php } ?> | | | | ");
$(’
#kitchen_sales_table’).append(’
|
’);
/* Problem here
$(".input_order_name_class"+(i)).on("change",function(){
$(".order_price"+(i)).val($(this).val());
});
*/
i++;
});
});[/embed]
Here is the html table and the add row button
[embed=425,349]
<thead>
<tr class="success text-primary">
<th>No</th>
<th>Order Name</th>
<th>Price</th>
<th>Plates No</th>
<th>Total Cost</th>
</tr>
</thead>
<tbody>
<tr id='addr0'>
<td>
1
</td>
<td>
<select class='form-control ui_order_name_signal' name='input_order_name[]' id='input_order_name' required>
<?php
$order_qry = $conn->prepare('select kit_menu_key, kit_menu_name from kitchen_menu order by kit_menu_name');
$order_qry->execute();
$order_q = $order_qry->fetchAll();
?>
<option selected disabled>--select--</option>
<?php foreach($order_q as $row){?>
<option value='<?php echo $row['kit_menu_key']; ?>'><?php echo $row['kit_menu_name']; ?></option>
<?php } ?>
</select>
</td>
<td>
<input type='text' class='form-control ui_price_signal' name='input_order_name_price' id='input_order_name_price' placeholder='enter price' required>
</td>
<td>
<input type='text' class='form-control input_order_name_plates_class' name='input_order_name_plates' id='input_order_name_plates' placeholder='enter number of plates' required>
</td>
<td>
<input type='text' class='form-control data-total-cost' name='input_order_name_tcost' id='input_order_name_tcost' placeholder='total cost' required>
</td>
</tr>
<tr id='addr1'>
</tr>
</tbody>
</table>
Add Another Order[/php]