3 つの入力と各行に 1 つのスパンを持つテーブルを含むフォームがあります。最初の入力は製品名です。記入してフォーカスを失ったとき、手元にある数量を取得するために ajax ポスト関数を使用しています。次に、その値をスパンに配置する必要があります。問題は、動的に追加されるこれらの行が 100 以上存在する可能性があるということです。このような .next() を使用してみました (
ここにjqueryがあります。
$( document ).ready(function () {
// set an on click on the button
$('input[id^="products"]').blur(function () {
var productName = $(this).val();
$.ajax({
type: "POST",
url: "<?php echo site_url('autocomplete/get_info'); ?>",
dataType: "json",
data: {productName:productName},
success: function(msg){
$('span[id^="qoh"]').html(msg);
}
});
});
});
Codeignighterによるフォームとテーブルの作成はこちら
<?php echo form_open('transactions/transaction_review'); ?>
<div class="form_settings">
<p><?php
$attributes = array(
'sales_reciept' => 'Sales Reciept',
'invoice' => 'Invoice'
);
echo form_dropdown('transaction_type', $attributes); ?></p>
<p><?php echo form_dropdown('customer', $customerName); ?></p>
<table id="product_table" style="width:100%; border-spacing:0;">
<tr>
<th>
Product Name
</th>
<th>
Description
</th>
<th>
Quantity
</th>
<th>
Quantity On Hand
</th>
<th>
Price
</th>
</tr>
<?php
for($index = 1; $index <= $product_num; $index++)
{
echo ' <tr id="product_info' . $index . '">
<td rowspan="1">' . form_input('product' . $index, 'Product', 'class="class-1" id="products"') . '</td>
<td rowspan="1">' . form_input('description' . $index, 'Description', 'class="class-1" ') . '</td>
<td rowspan="1">' . form_input('quantity' . $index, 'Quantity', 'class="class-1"') . '</td>
<td rowspan="1"><span id="qoh' . $index . '">0</span></td>
<td rowspan="1">' . form_hidden('ctrl' . $index, 'ctrl') . '</td>
</tr>';
}
echo form_hidden('index', $index, 'id="index"');
?>
</table>
<table id="tender_info">
<tr id="">
<td><?php echo form_input('elements', '0', 'id="elements"'); ?>
</td>
<td></td>
<td></td>
<td><p style="text-align: right"></p></td>
<td><?php echo form_input('sub_total', '0.00', 'class="subtotal"'); ?></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td><?php echo form_dropdown('paymentType', $payment_type); ?></td>
<td><?php echo form_input('paymentAmount', 'Total', 'class="total"'); ?></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td><?php echo form_input('discountAmount', 'discountAmount', 'class="class-1"'); ?></td>
</tr>
</table>
<p><?php echo form_input('note', 'note'); ?></p>
<?php echo form_hidden('status', 'status'); ?>
<p style="padding-top: 15px"><?php echo form_submit('submit', 'Create Transaction'); ?></p>
</div>
</div>
<?php echo form_close(); ?>
ajax ポストから返される値は、各行の ID od qoh "rownumber" を使用してスパンに追加する必要があります。値を取得することができ、現在書かれているように、スクリプトはすべての qoh スパンを同じ値に変更しました。jquery で . next() 関数を使用してこれに変更しようとしましたが、まったく機能し$('span[id^="qoh"]').html(msg);
ませ$(this).next('span').html(msg);
ん。また、製品の親を入力して .last を使用しようとしましたが、それでも何も得られませんでした。