如何在select2.js v4.0中显示ajax数据?

时间:2015-07-19 20:06:25

标签: javascript ajax asp.net-mvc jquery-select2 jquery-select2-4

我在asp mvc项目中使用select2 v4.0 https://select2.github.io/,我希望从动态数据中显示一个简单的下拉列表

版本3.6的旧方法不再适用:

我有一个c#方法:

public JsonResult GetSrcMethod()
 {
            var list = new[]
            { 
                new { id= 0, text= "Smith" },
                new { id= 1, text= "John" }, 
                new { id= 2, text= "Philippe" },    
            }.ToList();

            Object json = JsonConvert.SerializeObject(list);
            return Json(json, JsonRequestBehavior.AllowGet);   
 }

因此,返回的数据是:

[{"id":0,"text":"Smith"},{"id":1,"text":"John"},{"id":2,"text":"Philippe"}]

我有一个适用于以前版本3.6的javascript代码:

$(".example-select2").select2({
        ajax: {
            dataType: 'json',
            url: '@Url.Action("GetSrcLanguages", "GetCheckSet")',
            results: function (data) {
                return {results: data};
            }              
        }
    });

它会显示一个空的下拉列表,显示“找不到结果'

你知道如何在v4.0中做到这一点吗?

1 个答案:

答案 0 :(得分:3)

Idid不同,JavaScript对象的属性区分大小写。这同样适用于Texttext,您也希望使用全小写版本。

public JsonResult GetSrcLanguages()
        {
            var list = new[]
            { 
                new { id = 0, text = "Smith" },
                new { id = 1, text = "John" }, 
                new { id = 2, text = "Philippe" },    
            }.ToList();

            Object json = JsonConvert.SerializeObject(list);
            return Json(json, JsonRequestBehavior.AllowGet);   
        }

此外,{4.0}中的ajax.results方法已重命名为ajax.processResults,以避免与具有现有results方法的AJAX传输冲突。所以你的JavaScript应该看起来像

$(".example-select2").select2({
    ajax: {
        dataType: 'json',
        url: '@Url.Action("GetSrcLanguages", "GetCheckSet")',
        processResults: function (data) {
            return {results: data};
        }              
    }
});