Bootstrap Typeahead solo mostrando la primera letra

Question

Me está costando trabajo hacer funcionar el Typeahead de Twitter Bootstrap. Typeahead solo está haciendo coincidir la primera letra de una entrada. Mis resultados en el cuadro de escritura siguiente se ve algo como

n 
n 
n 
N 
N 
n. 

Mi código es

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

¿Alguien puede ayudar?

Answer 1

Acabo de probar su código, y funcionó para mí. Cuando cambié las cotizaciones que ser así, sin embargo, que estaba recibiendo el problema que está teniendo:

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

yo estaba corriendo en un problema similar, que es ligeramente diferente a su problema, pero podría ayudar a los demás. Lo que me estaba pasando es que el JSON que estaba pasando a typeahead estaba siendo interpretado como una matriz de caracteres. Así que si pasaba en:

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

Es lo interpretaría como una matriz de 26 caracteres, por lo tanto el resultado de escritura siguiente me estaba dando eran caracteres individuales.

En mi caso, fue porque estaba haciendo una llamada ajax y no configuré el tipo de datos en 'json'. En su caso, ese no es el problema, pero con suerte esto lo lleva a una solución.

Answer 2

Para cualquier persona que está recibiendo este problema cuando se utiliza una función fuente (es decir ajax llamada a su servidor):

uso:

process(JSON.parse(data)); 

en lugar de:

process(data); 

Answer 3

Compruebe el combinación de citas que sale en su html para el atributo fuente de datos. Estaba teniendo el mismo problema con el siguiente fragmento de código.

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

de cambiar a la siguiente, que he visto en otros ejemplos, no solucionarlo

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

pero el cambio a comillas simples alrededor del valor de atributo y comillas dobles para los elementos de búsqueda arreglado. Esto funciona.

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 
}}); 

por favor utilice este JSON.parse (resultado);