【发布时间】：2020-05-07 00:54:36
【问题描述】：
在抱歉我的英语不好之前
我有一个输入表，带有行 id，当 onchange 输入影响第 1 行中的下一个输入时。现在可以添加这一行，我为添加的每一行做了一个增量，所以 id 行将添加到第 2 行、第 3 行等。这里的问题是，如何操作已添加的行
这里是风景
<table class="table-common mb-4">
<tr>
<th>Product</th>
<th>Description</th>
<th>Quantity</th>
<th>Unit Price</th>
<th>Account</th>
<th>Tax</th>
<th>Total</th>
</tr>
<tr id="row1" class="item">
<td>
<select name="product[]" class="form-control form-control-select2 product">
<option value="">Choose one</option>
<?php
foreach ($productIds as $productId) {
$selected = getValue('productId', $row) == $productId->id ? 'selected' : NULL;
echo "<option value='{$productId->id}'>{$productId->code} - {$productId->name}</option>";
}
?>
</select>
</td>
<td><input type="text" name="description[]" class="form-control description"></td>
<td><input type="text" name="quantity[]" class="form-control form-control-decimal quantity"></td>
<td><input type="text" name="unitPrice[]" class="form-control form-control-decimal unitPrice"></td>
<td>
<select name="account[]" class="form-control form-control-select2 account">
<option value="">Choose one</option>
<?php
foreach ($accountIds as $accountId) {
$selected = getValue('accountId', $row) == $accountId->id ? 'selected' : NULL;
echo "<option value='{$accountId->id}'>{$accountId->code} - {$accountId->name}</option>";
}
?>
</select>
</td>
<td>
<select name="tax[]" class="form-control form-control-select2 tax">
<option value="">Choose one</option>
<?php
foreach ($taxIds as $taxId) {
$selected = getValue('taxId', $row) == $taxId->id ? 'selected' : NULL;
echo "<option value='{$taxId->id}'>{$taxId->name} - {$taxId->amount}</option>";
}
?>
</select>
</td>
<td><input type="text" name="totalPrice[]" class="form-control form-control-decimal totalPrice" readonly></td>
</tr>
</table>
点击添加更多时的这个
$(document).ready(() => {
let previousRow = $("tr:last").attr("id")
let counter = previousRow.charAt(3)
let count = parseInt(counter)
let no = 0
$("#addMore").on('click', (e) => {
count ++
no = count
$(".table-common").append(`
<tr id="row${count}" class="item">
<td>
<select name="product[]" class="form-control form-control-select2 product">
<option value="">Choose one</option>
<?php
foreach ($productIds as $productId) {
$selected = getValue('productId', $row) == $productId->id ? 'selected' : NULL;
echo "<option value='{$productId->id}'>{$productId->code} - {$productId->name}</option>";
}
?>
</select>
</td>
<td><input type="text" name="description[]" class="form-control description"></td>
<td><input type="text" name="quantity[]" class="form-control form-control-decimal quantity"></td>
<td><input type="text" name="unitPrice[]" class="form-control form-control-decimal unitPrice"></td>
<td>
<select name="account[]" class="form-control form-control-select2 account">
<option value="">Choose one</option>
<?php
foreach ($accountIds as $accountId) {
$selected = getValue('accountId', $row) == $accountId->id ? 'selected' : NULL;
echo "<option value='{$accountId->id}'>{$accountId->code} - {$accountId->name}</option>";
}
?>
</select>
</td>
<td>
<select name="tax[]" class="form-control form-control-select2 tax">
<option value="">Choose one</option>
<?php
foreach ($taxIds as $taxId) {
$selected = getValue('taxId', $row) == $taxId->id ? 'selected' : NULL;
echo "<option value='{$taxId->id}'>{$taxId->name} - {$taxId->amount}</option>";
}
?>
</select>
</td>
<td><input type="text" name="totalPrice[]" class="form-control form-control-decimal totalPrice" readonly></td>
<td><button type="button" class="btn btn-danger btn-sm delete"><i class="icon ion-close-round"></i></button></td>
</tr>
`)
})
$(`#row1 .product`).on("change", () => {
let productId = $(".product option:selected").val()
$.ajax({
url: `<?php echo base_url("accounting/configurations/products/index/") ?>${productId}`,
type: 'get',
dataType: 'json',
success: (data) => {
$("#row1 .description").val(data.description)
$("#row1 .description").val()
$("#row1 .unitPrice").val(data.sellPrice)
$("#row1 .sellAccountId").val(data.sellAccountId)
$("#row1 .sellTaxId").val(data.sellTaxId)
}
})
})
});
那么，添加后如何操作其他行？
【问题讨论】：
-
为什么要在php下标记这个？
-
因为它包含php和jquery，所以我都标记了
-
So, how to manipulate other row when it's added?。如何操作？ -
可以看到，每一行都有一个id，那么如何获取新添加的row id呢？
-
在给定的此链接中附加：stackoverflow.com/questions/24651890/… 或者，在添加行时，您应该调用 ajax 并在那里创建整个 HTML，然后无论您得到什么，都将其附加到表中。这是一种简单的方法，因为您正在附加 PHP 生成的循环。另外，
count++;之间有空格，请删除该空格。
标签： javascript php jquery bootstrap-4 codeigniter-3