如何實現Javascript自動完成功能？

我對編程頗爲陌生，但大多數時候我是JavaScript/jQuery的新手。我在這裏的原因是因爲即使我已經通過互聯網搜索自動完成搜索解決方案/我嘗試應用我發現的不同版本，但我無法獲得實際可行的解決方案:)如何實現Javascript自動完成功能？

這裏是我的一段代碼：

var mydata 
$(document).ready(function() 
{ 
    ConstructSuggestionArray(); 
    $("[id$='txtSearchProject']").keypress(function() 
    { 
     $("[id$='txtSearchProject']").autocomplete 
      ({ 
       source: mydata 
      }) 
    }) 
}); 

function ConstructSuggestionArray() 
{ 
    $.ajax 
    ({ 
     url: 'ProjectManagement.aspx/ConstructSuggestionArray', 
     type: "POST", 
     data: {}, 
     async: false, 
     dataType: "json", 
     contentType: "application/json; charset=utf-8", 
     success: function (response) 
     { 
      if (response.d != null) 
      { 
       mydata = jQuery.parseJSON(response.d); 
       return true; 
      } 
      else 
      { 
       return false; 
      } 
     } 
    }); 
}

而且，一段代碼，我構建陣列：

public string ConstructSuggestionArray() 
     { 
      using (DataClassesDataContext context = new DataClassesDataContext()) 
      { 
       List<Utils.ProjectsOfAUser> theProjects = 
         ReturnProjectsAccordingToAllocation(context); 
       string[] projectsNameArray = new string[theProjects.Count]; 
       int index = 0; 

      foreach (Utils.ProjectsOfAUser oneProject in theProjects) 
      { 
       projectsNameArray[index] = oneProject.Name; 
       index++; 
      } 

      string strJSON = string.Empty; 
      JavaScriptSerializer objJSSerializer = new JavaScriptSerializer(); 
      strJSON = objJSSerializer.Serialize(projectsNameArray).ToString(); 

      return strJSON; 
     } 
    } 
}

在我的項目，並在我的ASP我也補充腳本。網頁。

我非常困惑，如果你能幫我弄清楚這一點，我會非常感激。

提及：txtSearchProject - 是一個asp控件。

預先感謝您。

來源

2012-08-07 SunnyDay

http://jqueryui.com/demos/autocomplete/？ – 2012-08-07 12:05:25

如果你在你的jQuery中指定'dataType：'json''，你可能不需要調用'jQuery.parseJSON（）'，因爲你的'success'回調函數應該只傳遞一個對象而不是一個字符串。如果響應不是有效的JSON，'success'回調將不會被執行。你能發佈AJAX調用的響應嗎？ – 2012-08-07 12:13:27

顯然沒有答案。我在腳本中放了一些斷點（並且我使用的是IE，因爲我知道我無法在其他瀏覽器中進行調試），但它不會去那裏。對不起，我假設你聽到很多愚蠢/明顯的問題，但是如果我還沒有嘗試做一段時間的研究工作，現在我不會發布它:) – SunnyDay 2012-08-07 12:18:21

jQuery的AJAX方法是異步的，自動完成綁定到空變量，因此有去沒有選擇。然後回調運行並填充變量，但已爲時過晚。

這裏有兩種選擇。你可以把下面你成功回調：

$("[id$='txtSearchProject']").autocomplete("options", "source", mydata);

一旦它完成這將設置源下拉（這有更新的好處，如果你需要再次召本）。

您也可以將URL作爲源給予ConstructSuggestionArray，窗口小部件將處理調用頁面（請參閱「遠程數據源」的自動完成演示頁面並查看源代碼）。

來源

2012-08-07 13:47:21 Chao

謝謝，我會盡力讓它工作:) – SunnyDay 2012-08-08 06:36:14

你用過jQuery的自動完成插件是非常好的，也容易實現請通過此鏈接

http://jqueryui.com/demos/autocomplete/

來源

2012-08-07 12:05:31 rahul

這是我讀過的第一篇文檔之一，但我仍然無法理解在我的代碼中，我做錯了什麼。感謝您的回答。 – SunnyDay 2012-08-07 12:14:05

如何實現Javascript自動完成功能？

回答

相關問題