使用jQuery查詢遠程數據源自動完成

我試圖使用jQuery UI自動完成小部件http://jqueryui.com/demos/autocomplete/#remote實現一個asp.net文本框。使用jQuery查詢遠程數據源自動完成

小部件的source屬性需要一個字符串指向將返回JSON數據的URL資源。我有一個aspx頁面，將返回以下內容：

代碼背後：

private void GetWidgets(string name) 
{ 
    var jscriptSerializer = new JavaScriptSerializer(); 
    var widgets = jscriptSerializer.Serialize(GetMatchingWidgets(name)); 
    var script = "Widgets = {\"Widget\": " + widgets + "};"; 

    Page.ClientScript.RegisterStartupScript(Page.GetType(), "JSON", script, true); 
}

問題：

文檔說的The request parameter "term" gets added to that URL. - 所以我應該能夠得到「術語「作爲查詢字符串參數是否正確？
是否必須將JSON設置爲客戶端上的變量，還是小部件無需執行其他任何操作就可以完成綁定？

我是否缺少其他的東西？

我會給這個試試看，只是「算出來」但我沒有很多時間花在這個解決方案上。

幫助總是讚賞。

來源

2012-02-13 Rich

是的，term是QueryString參數的名稱。你所需要做的就是以預期的格式返回json數據。例如，這裏是I類使用...

/// <summary> 
/// JQuery UI Autocomplete plugin expects an object with "value" and/or "label" property. 
/// </summary> 
public class AutoCompleteData 
{ 
    /// <summary> 
    /// custom property 
    /// </summary> 
    public string id { get; set; } 

    /// <summary> 
    /// value is shown in text box after selection 
    /// </summary> 
    public string value { get; set; } 

    /// <summary> 
    /// label is shown in drop down list 
    /// </summary> 
    public string label { get; set; } 
}

例如...

string term = Request.QueryString["term"]; 

AutoCompleteData[] d = GetMatchingWidgets(term) 
    .Select(x => new AutoCompleteData { 
     label = x.widgetLabel, 
     value = x.widgetValue 
    }).ToArray(); 

return jscriptSerializer.Serialize(d);

來源

2012-02-13 17:52:11 dotjoe

所以在我的例子中，對象'script'是'AutoCompleteData'的陣列？ – Rich 2012-02-13 18:02:54

是的，它會是一個Json編碼的AutoCompleteData數組......但是，看着你的示例，你是想用客戶端的所有數據初始化客戶端並讓它在客戶端上搜索？我總是通過根據術語參數動態執行搜索來完成它。 – dotjoe 2012-02-13 19:11:47

fyi，如果在客戶端上執行搜索，則可以使用源選項初始化插件http://docs.jquery.com/UI/Autocomplete#option-soure當標籤和值不同時，我通常會使用該類，但如果它們'相同，那麼我認爲你也可以傳遞一串字符串。 – dotjoe 2012-02-13 19:15:38

使用jQuery查詢遠程數據源自動完成

回答

相關問題