Question

这是我的js

$(function() {
    var tryme = 5;
    var options = {
    source: "<?=base_url()?>/autocomplete/",
    minLength: 1,
    select: function( event, ui ) {
    event.preventDefault();

    this.value = ui.item.valuedesc;
    //$(this).siblings('.item_sku').val(ui.item.valuedesc); // not working
    //$(this).siblings('.description').val(ui.item.description); // not working
    //$(this).siblings('.rate').val(ui.item.rate); // not working
    }
    };
    $( ".item_sku" ).autocomplete(options);


    $(".add-row").click(function (e) {
        e.preventDefault();
        var cloned = $('#invoice_table tr:last').clone();
        cloned.appendTo('#invoice_table').find('input').val('');
        cloned.find('.item_sku').autocomplete(options);
    });
});

我正在使用jquery克隆一行字段以构建我的发票项目。

现在不工作的是特定的字段行没有更新。

这些是我的字段：

<input type="text" maxlength="255" name="item_sku[]" data-required="1" class="form-control item_sku" autocomplete="off" required/>

<input type="text" maxlength="255" name="item_description[]" id="description" data-required="1" class="form-control calculate description" required/>

<input type="text" maxlength="255" name="item_amount[]" data-required="1" class="form-control calculate rate" autocomplete="off" required/>

因此，当我开始输入int ITEM_SKU字段时，我得到了自动完成选项 - 这工作正常。当我点击它时，它必须更新描述和item_amount文本字段。

现在，如果我将字段类更改为ID，并将javascript更改为示例

<input type="text" maxlength="255" name="item_amount[]" id="rate" data-required="1" class="form-control calculate" autocomplete="off" required/>

有效。

但是因为我有一个“添加更多字段”按钮 - 我必须有多个具有相同ID的字段。

有人可以帮助我，以便使用ui.item.description和ui.item.rate

更新当前行的字段

http://i.share.pho.to/7945c43f_o.jpeg

Answer 1

我会使用hidden div作为库来克隆元素...
此外，克隆obj后删除ID。

类似^{（未经测试）}

$(".add-row").click(function (e) {
    e.preventDefault();
    var cloned = $('#hidden').find('#tr').clone().removeAttr('id');
    cloned.appendTo('#invoice_table');
    cloned.find('.item_sku').autocomplete(options);
});

编辑 ：简化jsfiddle示例^{（已测试）} http://jsfiddle.net/c5ajonav/3/

JAVASCRIPT更新两个字段，多行

1 个答案: