使用字符串元素列表作为Select2组件的源

时间:2013-10-23 09:13:49

标签: javascript jquery asp.net-mvc razor jquery-select2

我正在尝试为我正在研究的这个网站设计一个标签控制器,但是我无法让json-part正常工作。

从顶部开始,我的cshtml视图中有一个隐藏的输入元素(从this SO post获取的JS):

<input type="hidden" id="tagController" style="width: 350px;" />
...
    $(document).ready(function () {
        var lastResults = [];

        $("#tagController").select2({
            multiple: true,
            placeholder: "Please enter tags",
            tokenSeparators: [","],
            ajax: {
                multiple: true,
                url: "/UnitDetails/GetTagsAsJson/",
                dataType: "json",
                type: "POST",
                data: function (term, page) {
                    return {
                        json: JSON.stringify({ results: [{ id: "foo", text: "foo" }, { id: "bar", text: "bar" }] }),
                        q: term
                    };
                },
                results: function (data, page) {
                    lastResults = data.results;
                    return data;
                }
            },
            createSearchChoice: function (term) {
                var text = term + (lastResults.some(function (r) { return r.text == term }) ? "" : " (new)");
                return { id: term, text: text };
            },
        });
    });

然后,我的控制器中有一个动作:

[HttpPost]
public JsonResult GetTagsAsJson()
{
    return Json(Model.TagsAvailable, JsonRequestBehavior.AllowGet);
}

然后,列表TagsAvailable填充在我的索引操作中:

...
foreach (var tag in GetAvailableTags())
{
    Model.TagsAvailable.Add(tag.Name);
}
...

最后,GetAvailableTags()正在调用一个wcf服务,该服务在BaseTagController中返回一组TagContracts:

public List<TagContract> GetAvailableTags()
{
    return UnitClient.GetAllUnitTags().Select(unitTag => new TagContract
                                                             {
                                                                 Id = unitTag.Id,
                                                                 Name = unitTag.Name
                                                             }).ToList();
}

在chrome中检查控制台时,出现以下错误: Failed to load resource: the server responded with a status of 500 (Internal Server Error)

为了记录,我知道服务返回所请求的数据这一事实,我猜的代码问题更多,我想:)

1 个答案:

答案 0 :(得分:0)

遇到了一个帮助我完成我想要的教程。只需重新编写代码以匹配我的值。

可以找到Github代码here