将 Select 2 与 ASP.NET MVC 一起使用

Question

我正在开发一个 ASP.NET MVC 4 应用程序。在我的应用程序中，我试图用Select 2 plugin 替换我的下拉列表。目前，我在从 ASP.NET MVC 控制器加载数据时遇到问题。我的控制器如下所示：

public class MyController : System.Web.Http.ApiController
{
  [ResponseType(typeof(IEnumerable<MyItem>))]
  public IHttpActionResult Get(string startsWith)
  {
    IEnumerable<MyItem> results = MyItem.LoadAll();
    List<MyItem> temp = results.ToList<MyItem>();

    var filtered = temp.Where(r => r.Name.ToLower().StartsWith(startsWith.ToLower());
    return Ok(filtered);
  }
}

当我在这段代码中设置断点时，我注意到startsWith 没有值。断点被击中的事实意味着（我认为）我下面的url 属性设置正确。但是，我不确定为什么没有设置 startsWith。我使用以下 JavaScript 从 Select 2 调用它：

function formatItem(item) {
  console.log(item);
}

function formatSelectedItem(item) {
  console.log(item);
}

$('#mySelect').select2({
  placeholder: 'Search for an item',
  minimumInputLength: 3,
  ajax: {
    url: '/api/my',
    dataType: 'jsonp',
    quietMillis: 150,
    data: function (term, page) {
      return {
        startsWith: term
      };
    },
    results: function (data, page) {
      return { results: data };
    }
  },
  formatResult: formatItem,
  formatSelection: formatSelectedItem
});

当此代码运行时，我在选择 2 下拉列表中看到的唯一内容是 Loading failed。但是，我知道我的 api 被调用了。我可以在提琴手中看到 200 又回来了。我什至可以看到 JSON 结果，如下所示：

[
{"Id":1,"TypeId":2,"Name":"Test", "CreatedOn":"2013-07-20T15:10:31.67","CreatedBy":1},{"Id":2,"TypeId":2,"Name":"Another Item","CreatedOn":"2013-07-21T16:10:31.67","CreatedBy":1}
]

我不明白为什么这不起作用。

Answer 1

来自documentation：

Select2 提供了一些快捷方式，可以轻松访问本地数据 存储在数组中...

...这样的数组必须有“id”和“text”键。

您的 json 对象不包含“id”或“text”键 :) 虽然我还没有测试过，但这个 应该 可以工作：

results: function (data, page) {
   return { results: data, id: 'Id', text: 'Name' }
}

在替代键绑定的链接后面还有更多文档...我相信这就是您的问题所在。

希望这会有所帮助。