Reputation: 2466
HTML
<form action="#" method="POST" id="delivery_form">
<h3>Delivery Schedule</h3>
<table>
<tr><th>Item</th><th>Quantity</th><th>Amount</th><th>Date Start</th><th>Date End</th><th></th></tr>
<tr class="tr_clone">
<td>
<select name="item[]" id="item_name" onchange="getval(this);">
</select>
</td>
<td><input type="number" name="qty[]" /></td>
<td><input type="text" name="amt[]" /></td>
<td><input type="date" name="date_start[]" /></td>
<td><input type="date" name="date_end[]" /></td>
<td><input type="text" name="count" value="1"/><input type="button" name="add" value="Add" class="tr_clone_add"></td>
</tr>
<tr>
<td colspan="6">
<input type="text" name="contract_id" value="" />
<input type="submit" value="Submit" onclick="submit_delivery()" />
</td>
</tr>
</table>
</form>
When add
button is clicked, new row will be inserted. Now the issue is as follows:
1) When select box is changed, i will get the ID, and get PRICE for this item from db and display in the AMT textbox in the respective row.
SCRIPT:
function getval(sel) {
//alert(sel.value);//this gets the ID of the select box item
var data;
$.ajax({
type: "POST",
dataType: "json",
url: "../admin/get_item.php?item_id="+sel.value,
data: data,
success: function(data) {
console.log(data);
for(var i=0;i<data.length;i++)
{
alert(data[i].price);//price for the id obtained
//Here's the problem. The below would change price for all amount textbox. I need to change only for the related row. How to do this, please?
//$("input[name^=amt]").val(data[i].price);
}
}
});
}
Upvotes: 1
Views: 531
Reputation: 67207
You could use,
$("input[name^=amt]", $(sel).closest("tr")).val(data[i].price);
inside your ajax success callback
to target the element related to current row.
Upvotes: 1