2012-06-03 33 views
5

Có cách nào để tự động hoàn thành giao diện người dùng jQuery mà mảng JSON lập chỉ mục để sử dụng làm 'nhãn' và 'giá trị' khi không phải là tên chỉ mục được sử dụng trong mảng JSON?Giao diện người dùng jQuery Tự động hoàn thành: Cho tôi biết 'Nhãn' và 'Giá trị'

Các aray chứa giá trị tra cứu của tôi trông như thế này (như đăng nhập bằng Firebug):

[ Object { id="12", name="Don Davis" }, Object { id="17", name="Stan Smith" } ] 

Tôi muốn sử dụng 'id' là 'nhãn' và 'tên' là 'giá trị' nhưng có thể 't tìm ra cách để nói cho các đối tượng cấu hình.

Mảng của tôi được chứa trong một biến cục bộ - không có cuộc gọi Ajax nào được thực hiện.

Điều này response cho một câu hỏi khác giải quyết vấn đề bằng cách tạo đầu vào biểu mẫu ẩn, nhưng có vẻ như có cách xử lý rõ ràng hơn.

+0

Yu có thể làm bất cứ điều gì bạn muốn nếu bạn sử dụng hàm làm tham số "nguồn". –

Trả lời

7

Từ đọc Jquery UI tài liệu bạn có thể thử một cái gì đó như thế này:

<script> 
    $(function() { 
var projects = [ { id: "12",value: "Don Davis" }, { id: "17", value:"Stan Smith" } ] 

    $("#project").autocomplete({ 
     minLength: 0, 
     source: projects, 
     focus: function(event, ui) { 
      $("#project").val(ui.item.value); 
      return false; 
     }, 
     select: function(event, ui) { 
      $("#project").val(ui.item.value); 
      $("#project-id").val(ui.item.id); 

      return false; 
     }, 
     search: function(event, ui) { console.log(event); console.log(ui) } 
    }) 
    .data("autocomplete")._renderItem = function(ul, item) { 
     return $("<li></li>") 
      .data("item.autocomplete", item) 
      .append("<a>" + item.value+"</a>") 
      .appendTo(ul); 
    }; 
});​ 
    </script> 
+0

Cảm ơn - demo tài liệu cũng sử dụng trường ẩn cho 'id' (như trong trường # project-id của bạn), vì vậy tôi đoán đó là cách được hỗ trợ chính thức để làm điều đó, ngoài việc điều chỉnh chỉ mục mảng JSON trực tiếp. Bằng cách này có thể sẽ hoạt động tốt hơn. Cảm ơn một lần nữa. – cantera

+0

Lưu ý rằng trong jquery-ui 1.11 (và có thể sớm hơn), 'dữ liệu (" tự động hoàn thành ")' phải là 'dữ liệu (" uiAutocomplete ")' –

-1

Bạn phải trả lại một mảng như thế này: (phía máy chủ PHP)

for(...){
$suggest = array('value'=>$value,'label'=>$label); }

Các vấn đề liên quan