jquery自动完成搜索第二次不工作

时间:2017-10-17 21:24:40

标签: jquery ajax autocomplete

$(elem).autocomplete({
                        source: function(request, response) {
                            if (!names.length){
                                names = [NoResultsLabel];
                            }
                            response(names);
                        },
                        response: function (event, ui) {
                            ui.content.push({
                                label: "<button style=\"float:left;\" class=\"btn btn-default\" id=\"optionless\" onclick=\"previousSchools('"+elem.id+"','"+elem2.id+"')\"><<</button> <button style=\"float:right;\" class=\"btn btn-default\" id=\"optionless\" onclick=\"newSchools('"+elem.id+"','"+elem2.id+"')\">>></button>",
                                button: true
                            });
                        },
                        select: function (event, ui) {
                            if (ui.item.label === NoResultsLabel) {
                                event.preventDefault();
                            }
                            for(var i=0;i<data.schools.length;i++){
                                if(ui.item.label == names[i]){
                                    elem2.value = ids[i];
                                    i = data.schools.length;
                                }
                            }
                        },
                        close: function( event, ui ) {
                            requests_schools = 0;
                        }
                    });
                    $.ui.autocomplete.prototype._renderItem = function (ul, item) {
                        if(item.label == '<button style="float:left;" class="btn btn-default" id="optionless" onclick="previousSchools($(elem))"><<</button> <button style="float:right;" class="btn btn-default" id="optionless" onclick="newSchools($(elem))">>></button>')
                            return $("<li class='button-element'></li>")
                                    .data("item.autocomplete", item)
                                    .html(item.label)
                                    .appendTo(ul);
                        return $("<li></li>")
                                .data("item.autocomplete", item)
                                .html(item.label)
                                .appendTo(ul);
                    };
                    openSchoolsSuggestions(elem);

这是自动完成,我有很多结果具有相同的名称,略有不同,所以我设计了一个自定义&#34; paginator&#34;通过在响应中添加按钮,它可以用于第一页,但接下来它会关闭自动完成窗口并删除输入(用于名称)值

分页器的下一个和上一个函数:

  function newSchools(elemx,elem2){
        var elem = $('#'+elemx);
        if(requests_schools < 0)
            requests_schools = 0;
        requests_schools++;
        var value = elem.val();
        elem.autocomplete( "destroy" );
        elem.val(value);
        getSchools(document.getElementById(elemx),document.getElementById(elem2));
    }

    function previousSchools(elemx,elem2) {
        var elem = $(elemx);
        requests_schools--;
        if (requests_schools >= 0) {
            var value = elem.val();
            elem.autocomplete("destroy");
            elem.val(value);
            getSchools(document.getElementById(elemx),document.getElementById(elem2));
        }
    }

    function openSchoolsSuggestions(elem){
        elem = $(elem);
        elem.autocomplete("search");
    }

1 个答案:

答案 0 :(得分:0)

我找到了解决方案,我需要更改newSchools和previousSchools中的选择器,第一行转换为var elem = $(document.getElementById(elemx));