Jquery 1.8.2 autocomplete + .live() + .create()，不能一起工作

Question

我在一个asp.net MVC web应用程序内工作，我使用jQuery 1.8.2 &jquery ui 1.8.24。我有以下自动完成代码:-

$("#ServerTag,#SDTag,#FirewallTag,#RouterTag,#SwitchTag").live("focus.autocomplete", null, function () {
        var URL ="@Url.Content("~/Server/AutoComplete")";
        $(this).autocomplete({
            minLength: 1, delay: 1000,
            source: function (request, response) {
                $.ajax({
                    url: URL,
                    cacheLength:1,
                dataType: "json",
                data: {
                    term: request.term,
                    rackid: "@Model.Rack.TMSRackID.ToString()",
                    },
                success: function (data) {
                    response(data);
                },
                select: function (event, ui) {
                    return false;
                    },
                create: function () {
                    $(this).data("autocomplete")._renderItem = function (ul, item) {
                        return $('<li>').data('item.autocomplete', item).append('<a>' + '<b>' + item.label + '</b><br>' + '<span style="color: #737373;font-size: 12px;font-weight: 300;line-height: 16px;font-family: Helvetica,Arial,sans-serif;white-space: owrap;">' + item.resourcename + ' | ' + item.customername + ' | ' + item.sitename + '<hr style="padding: 0px; margin: 0px;">' + '</span></a>')
                                        .appendTo(ul);
                    };
                }
            });
        },
        });
    });

和下面的动作方法，它返回json:-

public ActionResult AutoComplete(string term,int? rackid)
        {
            var query = from techItems in ad
                        join resourcesItems in resources
                        on techItems.Technology.IT360ID.Value equals resourcesItems.RESOURCEID // join based on db2ID
                        orderby techItems.Technology.PartialTag
                        select new {  label = techItems.Technology.Tag.ToString(), customername = resourcesItems.ResourceLocation.SiteDefinition.AccountDefinition.ORG_NAME.ToString(), resourcename = resourcesItems.RESOURCENAME.ToString(), sitename = resourcesItems.ResourceLocation.SiteDefinition.SDOrganization.NAME };
            return Json(query, JsonRequestBehavior.AllowGet);

        }

我面临的问题是，自动完成的结果将只包含一个标签，而不是在创建部分内定义的连接字符串。

有谁能给点建议吗?看来我的.create并没有什么效果。

谢谢

Answer 1

我可以看到的一个可能的问题是在您的配置中，create和select选项被传递到ajax设置而不是自动完成。所以尝试

$("#ServerTag,#SDTag,#FirewallTag,#RouterTag,#SwitchTag").live("focus.autocomplete", null, function () {
    var URL = "@Url.Content("~ / Server / AutoComplete ")";
    $(this).autocomplete({
        minLength: 1,
        delay: 1000,
        source: function (request, response) {
            $.ajax({
                url: URL,
                cacheLength: 1,
                dataType: "json",
                data: {
                    term: request.term,
                    rackid: "@Model.Rack.TMSRackID.ToString()",
                },
                success: function (data) {
                    response(data);
                }
            });
        },
        select: function (event, ui) {
            return false;
        },
        create: function () {}
    });
    //this should happen outside the ajax callback
    $(this).data("autocomplete")._renderItem = function (ul, item) {
        return $('<li>').data('item.autocomplete', item).append('<a>' + '<b>' + item.label + '</b><br>' + '<span style="color: #737373;font-size: 12px;font-weight: 300;line-height: 16px;font-family: Helvetica,Arial,sans-serif;white-space: owrap;">' + item.resourcename + ' | ' + item.customername + ' | ' + item.sitename + '<hr style="padding: 0px; margin: 0px;">' + '</span></a>')
            .appendTo(ul);
    };
});

Answer 2

从jQuery 1.7开始，.live()方法已被弃用。使用.on()来附加事件处理程序。使用旧版本jQuery的用户应该优先使用。delegate()而不是。live()。