Question

我正在使用表单转发器来创建发票。发票有多个产品来自数据库并且价格合理。当我选择产品时，其价格自动显示为费用框，还有其他输入框，如折扣和百分比，默认值为0 0。第一行非常好。但是当我点击添加更多按钮以生成下一行以添加另一个产品时。

在下一行中，我可以从下拉列表中选择产品。但它的费用没有出现，折扣和百分比等其他输入框值也消失了（它们没有显示任何默认值。）

这是我的HTML代码。

<div class="row">
    <div class="col-xs-3">
        <label for="single" class="control-label">Select Invoice Type</label>
    </div>
    <div class="col-xs-2">Fee</div>
    <div class="col-xs-1">Quantity</div>
    <div class="col-xs-1">Discount</div>
    <div class="col-xs-2">Total</div>
    <div class="col-xs-1">Doctor %</div>
</div>
<div class="mt-repeater">
    <div data-repeater-list="group-b">
        <div data-repeater-item class="row">
            <div class="col-xs-3">
                <div class="form-group">
                    <select id="invoice" class="form-control" name="invoice">
                        <option></option>
                        <?php
                            $select = mysqli_query(connection(), "select * from treatement");
                            while($r = mysqli_fetch_array($select)) {
                                echo "<option value='$r[0]'>$r[name]</option>";
                            }
                         ?>
                    </select>
                </div>
            </div>
            <div class="col-xs-2">
                <div class="form-group">
                    <input type="text" value="" class="form-control"  placeholder="Fee" name="fees" id="fees">
                </div>
            </div>
            <div class="col-xs-1">
                <div class="form-group">
                    <input type="text"  class="form-control" value="1" name="quantity" >
                </div>
            </div>
            <div class="col-xs-1">
                <div class="form-group">
                    <input type="text" value="0" class="form-control" placeholder="Discount" name="discount">
                </div>
            </div>
            <div class="col-xs-2">
                <div class="form-group">
                    <input type="text" value="0" class="form-control" placeholder="Total" readonly name="total">
                </div>
            </div>
            <div class="col-xs-2">
                <div class="form-group">
                    <input type="text" value="0" class="form-control" placeholder="%" name="percentage">
                </div>
            </div>
            <div class="col-md-1">
                <a href="javascript:;" data-repeater-delete class="btn btn-danger">
                <i class="fa fa-close"></i>
                </a>
            </div>
        </div>
    </div>
    <a href="javascript:;" data-repeater-create class="btn btn-info mt-repeater-add">
    <i class="fa fa-plus"></i> Add More
    </a>
    <br>
    <br>
</div>

我使用js功能来比较每个产品的费用。这有助于我在一个盒子里显示费用。

$(document).ready(function() {
    $("#invoice").change(function() {
        var value = $(this).val();
        $.get("get_fees.php", {
            id: value
        }, function(data) {
            $("#fees").val(data);
        })
    })
})

Answer 1

请p ..不要使用这样的id。 id必须是唯一的，你应该使用class而不是ID（参见barmar评论）

<p id="test"></p>
<p id="test"></p>
<p id="test"></p>

应该是

<p id="test1" class="test"></p>
<p id="test2" class="test"></p>
<p id="test3" class="test"></p>

你做到了，我不使用相同的id，因为id必须是唯一的。

1个元素必须由1个元素使用。
1个类可以被许多元素使用

但是，你仍然可以破解它。 $('select[id="invoice"]')

似乎你创建了新的dom，你可以改变这一行

$("#invoice").change(function() {

成为

$("body").on('change', 'select[id="invoice"]', function() {

更新：为什么你总是改变你的第一个选择器/第一个id =费用。因为您使用的是$('#fees').val()

你必须指定：使用：获取父项（我使用closest()），然后找到具体的id =＆＃34;费用＆＃34;你想要改变

因为您没有标识您的父转发器的特定类，我选择添加rowsdata类

使用<div data-repeater-item class="row">

更改<div data-repeater-item class="row rowsdata">

，您的脚本将如下所示

$("body").on('change', 'select[id="invoice"]', function() {
    var select = $(this);
    $.get("get_fees.php", {
        id: select.val()
    }, function(data) {
        select.closest('.rowsdata').find('input[id="fees"]').val(data); //if you still give id="fees" and dont have any class use this
        //select.closest('.rowsdata').find('.fees').val(data); if you already give class="fees", use this
    });
});

Php没有工作添加更多行（表单中继器）

1 个答案: