У меня есть таблица, и если я нажму кнопку, я хочу взять значение с charge_outstanding_NUM и установить для него значение charge_receipt_NUM. Мне нужен многоразовый скрипт, потому что я не буду знать, сколько строк будет опубликовано.
<table>
<thead>
<tr>
<th>ID</th>
<th>Value</th>
<th>Outstanding</th>
<th>Reciept</th>
</tr>
</thead>
<tbody>
<tr>
<td>001</td>
<td>150.00</td>
<td id="charge_outstanding_1">150.00</td>
<td><input type="text" name="charge_receipt_1" id="charge_receipt_1" value=""></td>
</tr>
<tr>
<td>002</td>
<td>10.00</td>
<td id="charge_outstanding_2">10.00</td>
<td><input type="text" name="charge_receipt_2" id="charge_receipt_2" value=""></td>
</tr>
<tr>
<td>003</td>
<td>250.00</td>
<td id="charge_outstanding_3">250.00</td>
<td><input type="text" name="charge_receipt_3" id="charge_receipt_3" value=""></td>
</tr>
</tbody>
</table>
Мой jquery не работает, и я не уверен, почему. Я нажимаю кнопку, а затем прохожу через каждый столбец, который начинается с "charge_outstanding_", затем берет значение и назначает его ближайшему входу, находящемуся в той же строке.
$('#pay_in_full').click(function(){
$("[id^=charge_outstanding_]").each(function(){
charge = $(this).val();
$(this).closest('input').val(charge);
});
});
рабочий JSfiddle: http://jsfiddle.net/F5NvW/2/
Проблема с вашим кодом: charge = $(this).val();
вы находите td
который не имеет значения, вам нужно .html()
для этого
$(document).on("click", "#pay_in_full", function() {
$("[id^=charge_outstanding_]").each(function(){
var charge = $(this).html();
$(this).next().find('input').val(charge);
});
});
Предложение: используйте имя класса с каждым <td>
следующим образом:
Jsfiddle: http://jsfiddle.net/F5NvW/
Примечание: меньше ошибок.
$(document).on("click", "#pay_in_full", function() {
$(".outstanding").each(function(){
var charge = $(this).html();
$(this).next().find('.paidAmount').val(charge);
});
});
.Closest
будет искать элементы-предки. В вашем случае целевой input
- это дети следующего родственника выбранного элемента. Поэтому вы должны использовать .find()
или .children()
чтобы выбрать это.
Пытаться,
$('#pay_in_full').click(function(){
$("[id^='charge_outstanding_']").each(function(){
charge = parseInt($(this).text());
$(this).next().find('input').val(charge);
});
});
Кроме того, вы выбираете td element
, поэтому вам нужно использовать .text()
чтобы получить его текст не .val()