如何將遠程數據加載到select2並按標題搜索

我在查詢中返回一些數據（FOR JSON PATH，WITHOUT_ARRAY_WRAPPER）。我在我的服務器端（mvc控制器）調用這個查詢來獲取json數據，所以我可以在我的視圖中將它加載到select2中。如何將遠程數據加載到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}; 
     } 
    } 
});

and html

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

但是，當我運行它，沒有結果和沒有在控制檯中鉻或火狐錯誤。

如果我在我的電影控制器更改爲類似的東西一成不變的，它突然作品：

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不正確，還是javascript代碼 - select2用於顯示json？

請幫

來源

2017-08-30 aiden87

你的json在你的情況下是不同的。你有沒有試過選擇一個看起來像是可以工作的對象的匿名對象？ – Fran

有沒有例子？我真的不知道你的意思@Fran – aiden87

所以這個調用

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你查詢響應e匹配可以工作的結構。

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

來源

2017-08-30 18:43:42 Fran

哦，我現在明白了。好吧，我會試試這個，回到你身邊！ – aiden87

從docs：

我的對象不使用其獨特的識別符ID，我該怎麼辦？

Select2要求id屬性用於唯一標識顯示在結果列表中的選項。如果您使用除id之外的其他屬性（如pk）來唯一標識選項，則需要將舊屬性映射到id，然後將其傳遞給Select2。

我的對象使用其他的屬性比文本需要被顯示

就像使用id屬性的文本，選擇二要求應顯示爲一個選項的文本存儲在文本屬性。您可以使用以下JavaScript從任何現有屬性映射此屬性。

您需要返回某種id與您的數據庫中的記錄，以便您可以與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}; 
}

來源

2017-08-30 18:44:47 Dmitry

所以基本上沒有返回某種id，這是不可能的？ – aiden87

似乎如此。也許你可以使用'Title'作爲'id'，如果它是唯一的。 – Dmitry

title只是數據庫中的一個字符串/ nvarchar（255） – aiden87

如何將遠程數據加載到select2並按標題搜索

回答

相關問題