【问题标题】:changing value of dynamically generated input field jquery改变动态生成的输入字段jquery的值
【发布时间】:2015-01-21 16:27:42
【问题描述】:

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

场景:

我有一个名为add items 的按钮,单击它时会附加三个输入字段,分别名为itemnameunitsunitprice,其中itemname 有一个jqueryui autocompleteworking great,但我我还列出了keypress eventitemname 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.unitdata.price,并提醒数据库中的正确值..

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

【问题讨论】:

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


    【解决方案1】:

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

    ::::::::::::::::::::::::::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++;
        });
    

    感谢每一个人....

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-01-01
      • 2021-11-13
      • 2014-10-12
      • 1970-01-01
      • 2015-05-16
      相关资源
      最近更新 更多