如何在旧版jQuery UI中使jQuery UI自动完成功能正常工作？

debugcn 发表于 Dev

阿美迪纳

我正在尝试将自动完成的小部件添加到我的网页中，这是一种个性化的小部件。在我自己的配置遇到了一些问题之后，我决定直接在网页中尝试该官方示例，做所有我在那儿阅读的内容，然后替换掉

.autocomplete( "instance" )._renderItem = function( ul, item ) {
  return $( "<li>" )
    .append( "<div>" + item.label + "<br>" + item.desc + "</div>" )
    .appendTo( ul );
};

有了这个

.data("uiAutocomplete")._renderItem = function (ul, item) {
    return $("<li>")
    .append("<div>" + item.label + "<br>" + item.desc + "</div>")
    .appendTo(ul);
};

因为我使用的是jQuery UI 1.10.4，但无法更新（老板不希望我这样做）。我无法使该示例正常工作，并且我知道，如果我使该示例正常工作，那么我将不会遇到任何使该示例适应其必须要做的事情的问题。

拜托，你知道如何使它工作吗？提前致谢。

阿美迪纳

好吧，最后我放弃了。我克服这种情况的方法是将DTO转换为JSON，然后将其发送到浏览器，使其具有Autocomplete期望的格式。格式包含三个字段：

{
    id: ...,
    label: ...,
    value: ...
}

之后，我以这种方式配置了自动完成功能：

$("#<%= nuevoPadrePem.ClientID %>").autocomplete({
    minLength: 6,
    source: function (request, response) {
        var term = request.term;
        var result = [];

        $.ajax({
            url: 'PMENUEVAVERS.aspx/GetResultadosBusqueda',
            data: JSON.stringify({ texto: term }),
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            dataType: 'json',
            success: function (dtos) {
                response(dtos.d);
            }
        });
    },
    select: function (event, ui) {
        var dto = ui.item;
        $("#<%= hdSelectedNuevoPadrePem.ClientID %>").val(dto.id);
        $("#<%= nuevoPadrePem.ClientID %>").css('color', '#00BE00');
    }
})

它的工作没有问题。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。