select2にリモートデータをロードしてタイトルで検索する方法

Question

私のクエリに（JSON PATH、WITHOUT_ARRAY_WRAPPER）を使用して返すデータがあります。私はjsonデータを取得するために私のサーバー側（mvcコントローラ）でこのクエリを呼び出すので、私は後でselect2に私のビューで読み込むことができます。

私は、私はこのコードをデバッグする場合

public async Task<ActionResult> DisplayMovies() 
    { 
     Movies [] movieList = await movieStorage.GetAllMovies(); 

     if(Request.IsAjaxRequest()) 
     { 
      return Json(movieList, JsonRequestBehavior.AllowGet); 
     } 
     else 
     { 
      return View(); 
     } 
    } 

は、デバッガに戻りますが、このようにJSON私の映画のコントローラにこのコードを使用：

[{"Title": "Shawshank Redemption", "Director": "Frank Darabont", "Genre": "Drama", "ReleaseYear": "1994", "Rating": "9,3"}, 
{"Title": "Shutter Island", "Director": "Martin Scorsese", "Genre": "Mystery", "ReleaseYear": "2010", "Rating": "8,1"}, 
{"Title": "Pulp Fiction", "Director": "Quentin Tarantino", "Genre": "Crime", "ReleaseYear": "1994", "Rating": "8,9"}] 

これは私の.jsある

var myUrl = '@Url.Action("DisplayMovies", "Movies")'; 
$('.myMovies').select2( { 
    placeholder: 'Select movie...' , 
    minimumInputLength: 1, 
    ajax: { 
     url: myUrl, 
     dataType: 'json', 
     data: function (term, page) { 
      return { 
       searchTerm: term 
      }; 
     }, 
     results: function (data, page) {              
      return {results: data}; 
     } 
    } 
}); 

およびhtml

<select class="myMovies" multiple="multiple"> 
</select> 

しかし、私が実行すると、chromeまたはfirefoxのコンソールに結果とエラーはありません。

私はそのような静的なものに私の映画のコントローラを変更すると、それが突然動作します：

public async Task<ActionResult> DisplayMovies() 
    { 
     var list = new[] 
     { 
      new { id = 0, title = "Shawshank Redemption" }, 
      new { id = 1, title = "Shutter Island" }, 
      new { id = 2, title = "Pulp Fiction" }, 
     }.ToList(); 

     if (Request.IsAjaxRequest()) 
     { 
      Object json = JsonConvert.SerializeObject(list); 
      return Json(json, JsonRequestBehavior.AllowGet); 
     } 
     else 
     { 
      return View(); 
     } 
    } 

なぜこの仕事をしてではなく、私は、データベースからデータを取得するとき？エラーはどこですか？ jsonがデータベースから正しくないか、それともjsonを表示するためのjavascriptコード - select2ですか？

Answer 1

だからこの呼び出し

Movies [] movieList = await movieStorage.GetAllMovies(); 

リターンこのJSON

[{"Title": "Shawshank Redemption", "Director": "Frank Darabont", "Genre": "Drama", "ReleaseYear": "1994", "Rating": "9,3"}, 
{"Title": "Shutter Island", "Director": "Martin Scorsese", "Genre": "Mystery", "ReleaseYear": "2010", "Rating": "8,1"}, 
{"Title": "Pulp Fiction", "Director": "Quentin Tarantino", "Genre": "Crime", "ReleaseYear": "1994", "Rating": "8,9"}] 

それは

[ 
{"id": 0, "title":"Shawshank Redemption"} 
... 
] 

だからあなたを形作るある作品JSONと一致していません助けてください応答を照会する作業している構造と一致するようにします。 docsから

Movies [] movieList = await movieStorage.GetAllMovies() 
    .Select((v,i) => new { id = i, title = v.Title }).ToArray(); 

Answer 2

：

私のオブジェクトは、一意の識別子のIDを使用していない、私は何ができるのでしょうか？

Select2では、結果リストに表示されるオプションを一意に識別するためにidプロパティを使用する必要があります。 id（pkなど）以外のプロパティを使用してオプションを一意に識別する場合は、古いプロパティをidにマップしてからSelect2に渡す必要があります。

私のオブジェクトがジャストIDプロパティと同じように

を表示する必要テキストのテキスト以外のプロパティを使用し、Selectセレクトはオプションで表示されるべきテキストはテキストで保存されている必要がありますプロパティ。次のJavaScriptを使用して、既存のプロパティからこのプロパティをマップできます。

idのレコードをDBから取得して、select2と一緒に使用できるようにする必要があります。次に、結果を次のようにマッピングします。

results: function (data, page) { 
    var data = $.map(data, function (obj) { 
     obj.id = obj.someID;//some id you don't have right now 
     obj.text = obj.Title; 
     return obj; 
    }); 
     return {results: data}; 
}