jquery autocomplete với Danh sách <string> như Nguồn

Question

tôi có tên hộp văn bản txtEmailList, tôi cung cấp danh sách autocomplete cho nó,

<asp:TextBox runat="server" ID="txtEmailList" CssClass="txtAutoComplete"> 

kịch bản cho autocomplete

$('#txtEmailList').autocomplete({ 
       source: function(request, response) { 
// this is the ajax call, which is running successfully 
        var msg = 
Assessments_JqueryAutoComplete.AutoComplete(request.term).value; //(ajaxpro functions) 
        response(msg.d); 
       } 

      }); 

đầu ra sẽ đến như là như thế này (trong firebug nó hiển thị dạng plain/text), làm thế nào tôi có thể đính kèm mảng này vào thuộc tính nguồn. (Tôi không thể sử dụng phương thức $ .ajax, vì tôi cần sử dụng ajaxpro làm quy tắc văn phòng), vì vậy tôi lấy danh sách mảng từ cuộc gọi ajax, làm cách nào để tôi liên kết tự động hoàn thành.

[ "Danh sách 1", "Danh sách 2", "Danh sách 3", "Danh sách 4"];/* // đây là phản ứng đầu ra từ jquery (từ firebug)

[AjaxPro.AjaxMethod(HttpSessionStateRequirement.ReadWrite)] 
public List<string> AutoComplete(string query) 
{ 
List<string> objLisItmes = new List<string>(); 
objLisItmes.Add("List 1"); 
objLisItmes.Add("List 2"); 
objLisItmes.Add("List 3"); 
objLisItmes.Add("List 4"); 
return objLisItmes; 
} 

đây là đầu ra firebug cho tiêu đề Phản hồi

Cache-Controlno-cache Nội dung-Length40 Nội dung-Typetext/plain; charset = utf-8 DateWed, ngày 07 tháng 3 năm 2012 10:45:37 GMT Expires-1Pragmano-cache

Answer 1

Thay vì trả lại một danh sách. Tôi sẽ trả về một chuỗi mảng như:

[AjaxPro.AjaxMethod(HttpSessionStateRequirement.ReadWrite)] 
public string[] AutoComplete(string query) 
{ 
    List<string> objLisItmes = new List<string>(); 
    objLisItmes.Add("List 1"); 
    objLisItmes.Add("List 2"); 
    objLisItmes.Add("List 3"); 
    objLisItmes.Add("List 4"); 
    return objLisItmes.ToArray(); 
} 

Answer 2

Thay vì sử dụng

$('#txtEmailList') 

hãy thử sử dụng

$('input[id$="txtEmailList"]') 

Vì bạn đang sử dụng một TextBox kiểm soát máy chủ ID của bạn cho nó rất có thể kết thúc lên như một cái gì đó như "parentID1_parentID2_txtEmailList". Đoạn mã trên sẽ lấy đầu vào có một ID kết thúc bằng "txtEmailList".

Đây là cách tôi đang thực hiện nó trong dự án thử nghiệm của mình và nó đang hoạt động. Tất nhiên tôi không sử dụng AjaxPro, vì vậy tôi không chắc chắn chính xác cách bạn sẽ làm điều đó với điều đó thay vào đó, nhưng có lẽ nó sẽ cung cấp cho bạn một số ý tưởng.

<script type="text/javascript"> 
     $(function() { 
      var element = $('input[id$="TextBox1"]'); 

      element.autocomplete({ 
       source: function (request, response) { 
        $.ajax({ 
         url: "Default.aspx/GetList", 
         data: "{ 'term': '" + request.term + "' }", 
         dataType: "json", 
         type: "POST", 
         contentType: "application/json; charset=utf-8", 
         dataFilter: function(data) { return data; }, 
         success: function (data) { 
          response($.map(data.d, function (item) { 
           return { 
            value: item 
           } 
          })) 
         } 
        }) 
       } 
      }); 
     }); 
    </script> 

Answer 3

nên không nó là:

$('#txtEmailList').autocomplete({source: function(request, response) { 
    // this is the ajax call, which is running successfully 
    var msg = Assessments_JqueryAutoComplete.AutoComplete(request.term).value; //(ajaxpro functions) 
    response(msg); 
    } 

}); 

?

Nếu không, tôi khuyên bạn nên sử dụng console.log (msg) để phân tích đối tượng phản hồi nếu có thể.

Answer 4

Chỉ cần đảm bảo cuộc gọi AJAX của bạn trả lại định dạng chuỗi hợp lệ như thế này dummy example. Lưu trữ nó trong một biến. Sau đó sử dụng nó để xác định source bất động sản như thế này:

var availableValues = ["List 1","List 2","List 3","List 4"]; 
// var msg = Assessments_JqueryAutoComplete.AutoComplete(request.term).value; 
$("#txtEmailList").autocomplete({ 
    source: availableValues 
});