Bootstrap Typeahead chỉ hiển thị chữ cái đầu tiên

Question

Tôi đang gặp khó khăn khi sử dụng Typeahead của Twitter Bootstrap để làm việc. Typeahead chỉ phù hợp với chữ cái đầu tiên của một đầu vào. kết quả của tôi trong hộp typeahead trông giống như

n 
n 
n 
N 
N 
n. 

Mã của tôi là

<%= text_field_tag :search, params[:search], "data-provide" => "typeahead", "data-source" => '["USA", "Canada","Mexico"]' %> 

bất cứ ai có thể giúp đỡ?

Answer 1

Tôi vừa thử mã của bạn và mã này đã hoạt động đối với tôi. Khi tôi thay đổi các dấu ngoặc kép được như mặc dù điều này, tôi đã nhận được vấn đề bạn đang gặp phải:

"['USA', 'Canada','Mexico']" 

tôi đã chạy vào một vấn đề tương tự, nó hơi khác so với vấn đề của bạn, nhưng nó có thể giúp đỡ người khác. Những gì đã xảy ra với tôi là JSON tôi đã chuyển sang typeahead đã được hiểu là một mảng ký tự. Vì vậy, nếu tôi đã thông qua:

["USA", "Canada","Mexico"] 

Nó sẽ giải thích nó như một mảng gồm 26 ký tự, do đó các kết quả đánh máy đã cho tôi là các ký tự đơn.

Trong trường hợp của tôi, đó là vì tôi đã thực hiện cuộc gọi ajax và tôi đã không đặt DataType thành 'json'. Trong trường hợp của bạn mà không phải là vấn đề, nhưng hy vọng điều này giúp bạn di chuyển hướng tới một giải pháp!

Answer 2

Đối với bất cứ ai nhận được vấn đề này khi sử dụng một hàm nguồn (tức là ajax gọi đến máy chủ của bạn):

sử dụng:

process(JSON.parse(data)); 

thay vì:

process(data); 

Answer 3

Kiểm tra kết hợp các dấu ngoặc kép là đầu ra trong html của bạn cho thuộc tính nguồn dữ liệu. Tôi đã gặp vấn đề tương tự với đoạn mã sau.

<input type="text" name="test" id="test" class="span2" data-provide="typeahead" 
data-items="4" data-source="['thisone','another','zzzz']"> 

thay đổi để những điều sau đây, mà tôi đã nhìn thấy trong các ví dụ khác, không sửa chữa nó

data-source="["thisone","another","zzzz"]" 

nhưng chuyển sang dấu nháy đơn xung quanh giá trị thuộc tính và hai dấu ngoặc kép cho các yếu tố tìm kiếm sửa nó. Công trình này hoạt động.

data-source='["thisone","another","zzzz"]' 

Answer 4

var data = ""; 
$.ajax({ 
     url: 'ajax/getdirverandpass.php', 
     success: function (result) { 
      data = JSON.parse(result); 
     }, 
     async: false 
}); 

$("#nav-search-input").typeahead({source: data, updater: function (a) { 
      $("#nav-search-input").focus(); 
      return a 
}}); 

hãy dùng nó JSON.parse (kết quả);