Question

我有一个输入框，我已经应用了简单的自动完成功能，在一个类的帮助下，我添加了输入按钮，点击该按钮，它再添加一个输入框，我可以添加尽可能多的输入框但是简单的自动完成功能不适用于所有添加的输入框，它们具有相同的类。

var options = {     
            url: function (phrase) {
                return "all_social_media.php";
            },
            getValue: function (element) {
                return element.name;
                conole.log(element.name);
            },
            ajaxSettings: {
                dataType: "json",
                method: "POST",
                data: {
                    dataType: "json",
                }
            },
            preparePostData: function (data) {
                data.phrase = $(".social_media").val();
                return data;
                console.log(data);
            },
            requestDelay: 400,
                list: {
                onSelectItemEvent: function() {
                }
            }
        };
        $(".social_media").easyAutocomplete(options);

Answer 1

找到了解决方案，我必须在动态生成的文本框中重写简单自动完成代码的代码

//create new socials and expenses fields
$("#add_socials").click(function(){
    var html_data = $('<div class="row" style="margin-top:10px;"><div class="col-md-5"><input type="text" class="form-control social_media" placeholder="Enter Social Media" name="social_media"></div><div class="col-md-5"><input type="text" class="form-control social_media_expenses" name="social_media_expenses"  placeholder="Enter Expenses"></div><div class="col-md-2"><button type="button" class="btn btn-icon btn-danger mr-1" onclick="delete_socials(this)"><i class="fa fa-times"></i></button></div></div>');
    $(".add_social_data").append(html_data);

    // easy auto complete is not working on dynamic generate text box, need to do this again
    var options = {     
        url: function (phrase) {
            return "all_social_media.php";
        },
        getValue: function (element) {
            return element.name;
            conole.log(element.name);
        },
        ajaxSettings: {
            dataType: "json",
            method: "POST",
            data: {
                dataType: "json",
            }
        },
        preparePostData: function (data) {
            data.phrase = $(".social_media").val();
            return data;
            console.log(data);
        },
        requestDelay: 400,
            list: {
            onSelectItemEvent: function() {
            // get_order_id = $("#order_line_entry").getSelectedItemData().order_id;
            // console.log(get_order_id);
            }
        }
    };
    $(".social_media").easyAutocomplete(options);
    html_data.find('.social_media').easyAutocomplete(options);
});

对我来说，它运作良好。

简单的自动完成功能不适用于输入框类

1 个答案: