改变动态生成的输入字段jquery的值

时间:2015-01-21 16:27:42

标签: javascript jquery codeigniter jquery-ui dynamic-values

我正在尝试更改动态生成的输入字段的值。

情景:

我有一个名为add items的按钮,点击它后会追加三个名为itemnameunitsunitprice的输入字段,其中itemname有一个jqueryui autocompleteworking great,但我也列出了keypress event的{​​{1}},因此当用户在从自动填充中选择所需的项目名后按Enter键时,应获取该用户的项目名称的单位和价格已选择使用自动填充代码:

itemname field

一切都运行良好,但它没有改变单位和单位价值的价值,我也尝试提醒var count = 1; $('#add-items').click(function () { $('#items').append('<div><br><i class="fa fa-angle-right"></i>. <input type="text" name="itemname[]" id="itemname-' + count + '" class="itemname" placeholder="item name"/>\n\ <input type="text" name="units[]" id="units-' + count + '" size="10" placeholder="units" style="text-align: right"/>\n\ <input type="text" name="unitprice[]" id="unitprice-' + count + '" size="10" placeholder="unit price" style="text-align: right"/>\n\ <a href="javascript:void(0);" id="remove-items"><i class="fa fa-trash-o"></i></a></div>'); $('#itemname-' + count).autocomplete({ source: "<?= site_url('administrator/item-autocomplete') ?>", minLength: 2 }); $('#itemname-' + count).on('keypress', function (e) { var name = jQuery(this).val(); var code = (e.keyCode ? e.keyCode : e.which); if (code == 13) { e.preventDefault(); $.ajax({ type: "POST", url: "<?= base_url() ?>administrator/get-unit-and-price/", data: {name: name}, dataType: "json", success: function (data) { if (data.valid == true) { //document.getElementById('units-' + count).value = data.unit; //document.getElementById('unitprice-' + count).value = data.price; $('#units-' + count).attr('value', data.unit); $('#unitprice-' + count).attr('value', data.price); //$('#units-' + count).val(data.unit); //$('#unitprice-' + count).val(data.price); } else { alert(data.html); } } }); } }); count++; }); data.unit并提醒数据库正确的值..

我想知道我需要做些什么才能使它工作..寻找建议和帮助,在此先感谢..抱歉英语不好..

1 个答案:

答案 0 :(得分:0)

发布解决方案,以便其他人可以获得一些帮助... :)

::::::::::::::::::::::::::EDIT:::::::::::::::::::::::::::::::

data-count添加到动态输入字段itemname[]

并修改了ajax的成功函数:

$('#units-' + thecount).attr('value', data.unit);
$('#unitprice-' + thecount).attr('value', data.price);

现在情况正常,当我按Enter键时,它也会更改units[]unitprice[]输入字段的值,

::::::::::::::updated solution::::::::::::::::

var count = 1;
    $('#add-items').click(function () {
        $('#items').append('<div><br><i class="fa fa-angle-right"></i>. <input data-count="'+ count +'" type="text" name="itemname[]" id="itemname-' + count + '" class="itemname" placeholder="item name"/>\n\
                <input type="text" name="units[]" id="units-' + count + '" class="units" size="10" placeholder="units" style="text-align: right"/>\n\
                <input type="text" name="unitprice[]" id="unitprice-' + count + '" class="unitprice" size="10" placeholder="unit price" style="text-align: right"/>\n\
                <a href="javascript:void(0);" id="remove-items"><i class="fa fa-trash-o"></i></a></div>');
        $('#itemname-' + count).autocomplete({
            source: "<?= site_url('administrator/item-autocomplete') ?>",
            minLength: 2
        });
        $('#itemname-' + count).on('keypress', function (e) {
            var name = jQuery(this).val();
            var thecount = jQuery(this).data('count');
            var code = (e.keyCode ? e.keyCode : e.which);
            if (code == 13) {
                e.preventDefault();
                $.ajax({
                    type: "POST",
                    url: "<?= base_url() ?>administrator/get-unit-and-price/",
                    data: {name: name},
                    dataType: "json",
                    success: function (data) {
                        if (data.valid == true) {
                            $('#units-' + thecount).attr('value', data.unit);
                            $('#unitprice-' + thecount).attr('value', data.price);
                        } else {
                            alert(data.html);
                        }
                    }
                });
            }
        });
        count++;
    });

感谢每一个人......