Asp.net mvc jQueryUI+；ASP.NETMVC使用json数据自动完成

我在使用jQueryUI自动完成调用JSON时遇到了很大的问题。 我有一个相当简单的JS：

$(document).ready(function() {
    $('#Editor_Tags').autocomplete({
        source: "/Forums/Ajax/GetTags",
        focus: function () {
            // prevent value inserted on focus
            return false;
        },
        select: function (event, ui) {
            var terms = split(this.value);
            // remove the current input
            terms.pop();
            // add the selected item
            terms.push(ui.TagName);
            // add placeholder to get the comma-and-space at the end
            terms.push("");
            this.value = terms.join(", ");
            return false;
        }
    });
});

这就是我想要返回的模型：

public class TagView
{
    public int TagId { get; set; }
    public string TagName { get; set; }
    public int Weight { get; set; }
}

但这不是主要问题。 主要问题是，当我开始键入时，jQuery并没有向控制器发出请求。我100%确信，指定的Url是好的。因为我可以通过键入/Forums/Ajax/GetTags？term=text手动访问控制器 我得到了结果。

---

我正在直接从google CDN使用jQuery和jQUI的新闻集版本。

jQueryUI自动完成小部件希望

源

参数中的数据满足以下要求：

[…]字符串的简单数组，或者 包含中每个项目的对象 数组，带有标签或值 财产或两者兼而有之

所以你有两个选择：

将要序列化的viewmodel更改为JSON以满足这些要求：

public class TagView
{
    public string Label { get; set; }
    public string Value { get; set; }
}

将autocomplete小部件的

source

参数更改为您自己执行AJAX调用并适当格式化数据的函数：

$("#Editor_Tags").autocomplete({
    source: function (request, response) {
        $.getJSON("/Forums/Ajax/GetTags", { term: request.term }, function (data) {
            response($.map(data, function (el) {
                return {
                    label: el.TagName,
                    value: el.TagId
                };
            }));
        });
    },
    /* other autocomplete options */
});

这是假设从服务器返回的数据是

TagView

对象的JSON数组

---

第二段代码未经测试，但至少应该让您找到正确的方向。

jQueryUI autocomplete小部件希望

源

参数中的数据满足以下要求：

[…]字符串的简单数组，或者 包含中每个项目的对象 数组，带有标签或值 财产或两者兼而有之

所以你有两个选择：

将要序列化的viewmodel更改为JSON以满足这些要求：

public class TagView
{
    public string Label { get; set; }
    public string Value { get; set; }
}

将autocomplete小部件的

source

参数更改为您自己执行AJAX调用并适当格式化数据的函数：

$("#Editor_Tags").autocomplete({
    source: function (request, response) {
        $.getJSON("/Forums/Ajax/GetTags", { term: request.term }, function (data) {
            response($.map(data, function (el) {
                return {
                    label: el.TagName,
                    value: el.TagId
                };
            }));
        });
    },
    /* other autocomplete options */
});

这是假设从服务器返回的数据是

TagView

对象的JSON数组

---

第二段代码未经测试，但至少应该让您走上正确的方向。

我已将其与此代码一起使用：

    $('#Editor_Tags').autocomplete({
    source: function (request, response) {
        $.ajax({
            url: "/Forums/Ajax/GetTags",
            dataType: "json",
            data: {
                term: request.term
            },
            success: function (data) {
                response($.map(data, function (item) {
                    return {
                        label: item.TagName,
                        value: item.TagName
                    }
                }));
            }
        });
    }

});

---

从本质上讲，这与安德鲁发布的内容没有太大区别

我已将其与以下代码配合使用：

    $('#Editor_Tags').autocomplete({
    source: function (request, response) {
        $.ajax({
            url: "/Forums/Ajax/GetTags",
            dataType: "json",
            data: {
                term: request.term
            },
            success: function (data) {
                response($.map(data, function (item) {
                    return {
                        label: item.TagName,
                        value: item.TagName
                    }
                }));
            }
        });
    }

});

---

从本质上讲，这与安德鲁发布的内容没有太大区别

@Lukasz Baran:你在页面上看到JavaScript错误了吗？在Firebug中打开

控制台
选项卡时会发生什么？是否发送了任何请求？在firebug控制台中，它看起来很好，并请求检索数据，但在Fiddler中，我没有得到ajax调用的任何结果。@Lukasz Baran:您在页面上看到任何JavaScript错误吗？在Firebug中打开
控制台
选项卡时会发生什么？是否发送了任何请求？在firebug控制台中，它看起来很好，并请求检索数据，但另一方面在Fiddler中，我并没有得到ajax调用的任何结果。