jquery自动完成动态生成的文本框无法正常工作

前端之家收集整理的这篇文章主要介绍了jquery自动完成动态生成的文本框无法正常工作前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我不能在动态生成的文本框上做自动完成,我已经搜索了互联网,但找不到任何解决方案.我正在分享到目前为止我所做的事情:

JQUERY:

function bindAutoComplete(classname) {
    $("." + classname).autocomplete({
        source: function (request,response) {
            $.ajax({
                url: '/Admin/Ticket/GetPart',type: "GET",dataType: "json",data: { term: request.term },success: function (data) {
                    if (data != null) {
                        if (data.length > 0) {
                            response($.map(data,function (item) {
                                return { label: item.PartNumber,value: item.PartNumber };
                            }))
                        }
                        else {
                            response([{ label: 'No results found.' }]);
                        }
                    }
                }
            })
        },});

}

// fetch part number
$(document).ready(function () {
    $("#PartNumber23").autocomplete({
        source: function (request,});

    $('#PartNumber23').keyup(function () {
        var errormsg = "";
        var amount = $('#PartNumber23').val();

        $.ajax({
            type: "GET",url: '/Admin/Ticket/GetPart',data: { 'term': amount },success: function (data) {
                if (data != null) {
                    if (data.length > 0) {
                        $('#Manufacturer').val(data[1].Manufacturer);
                        $('#DateCode').val(data[0].DateCode);
                        $('#Package').val(data[0].PackageCase);
                        $('#buyingprice').val(data[0].Price);
                    }
                    else {
                        $('#Manufacturer').val('');
                        $('#DateCode').val('');
                        $('#Package').val('');
                        $('#buyingprice').val('');
                    }
                }

            },error: function (jqXHR,exception) {
                $('#error').html(jqXHR)
            }
        });
    });
})

var key = function () {
    var errormsg = "";
    var amount = $('#buyingprice').val();

    $.ajax({
        type: "POST",url: "/Admin/Ticket/ConvertCurrency",data: "{amount:" + amount + "}",contentType: "application/json; charset=utf-8",success: function (data) {
            $('#bpusd').val(data);
        },exception) {
            // $('#error').html("Primitive Functions not allowed.")
        }
    });
}

var key2 = function () {
    var errormsg = "";
    var amount = $('#customprice').val();

    $.ajax({
        type: "POST",success: function (data) {
            $('#amtusd').val(data);
        },exception) {
            // $('#error').html("Primitive Functions not allowed.")
        }
    });
}

$(document).ready(function () {
    $('#PartNumber23').keyup(key);
    $('#buyingprice').keyup(key);
    $('#customprice').keyup(key2);
    $('#Quantity').keyup(function () {
        var qty = $('#Quantity').val();
        $('#CustomQuantity').val(qty);
    })
})

$("#AddMore").click(function () {

    $("#maintable").each(function () {

        var tds = '

HTML:

Box single-line" id="Manufacturer" name="Manufacturer" type="text" value="" />
                                                Box single-line" id="DateCode" name="DateCode" type="text" value="" />
                                                Box single-line" id="Package" name="Package" type="text" value="" />
                                                Box single-line" data-val="true" data-val-number="The field Quantity must be a number." data-val-required="The Quantity field is required." id="Quantity" name="Quantity" style="width:35px;" type="number" value="" />
                                                Box single-line" id="CustomQuantity" name="CustomQuantity" style="width:35px;" type="text" value="" />
                                                Box single-line" id="buyingprice" name="BuyingPrice" type="text" value="" />
                                                Box multi-line" id="Note" name="Note" placeholder="Any Note With Ticket">

我已经用类替换了id,但是自动完成仅适用于已经存在的文本框而不是动态文本

最佳答案
检查这个Working Fiddle Demo.

JS

bindAutoComplete('inputs');
$("#AddMore").click(function () {

    $("#maintable").each(function () {

        var tds = '

附加输入元素后,调用bindAutoComplete(‘inputs’)

HTML – 添加类名,例如:class =“inputs”to< input>标签.

猜你在找的jQuery相关文章