¿Cómo puedo enviar automáticamente la selección realizada con Twitter Bootstrap typeahead() ??¿Enviar selección en Bootstrap typeahead() autocompletar?
http://twitter.github.com/bootstrap/javascript.html#typeahead
Aparentemente hay unas pocas solicitudes de fusión de git. Éste hace el trabajo y le permite enviar una matriz de objetos para escribir anticipadamente: https://github.com/twitter/bootstrap/pull/1751
ya entiendo que no es la mejor solución posible. Pero era lo único que podía pensar como una solución temporal. – Jako
podría no ser la mejor solución, pero simplemente intentado esto en mi configuración de escritura siguiente nivel local y ha funcionado.
Si su typeahead ve algo como esto ...
<form id="test-form" method="post" action="">
<input id="test-input" type="text" data-provide="typeahead"
data-source='["1","2',"3"]' />
</form>
A continuación, se puede presentar con este javascript.
<script type="text/javascript">
$('#test-input').change(function() {
$('#test-form').submit();
});
</script>
Hmm, simplemente lo probé. Solo parece funcionar cuando selecciono directamente la opción, pero no cuando presiono enter o tab para seleccionar. –
Agregué una devolución de llamada blur en la entrada. Tenga en cuenta que debe esperar un breve período, que typeahead puede cambiar el valor de la entrada y no se llama a la devolución de llamada blur. Es solo una solución, pero funciona.
$('input.myTypeaheadInput').blur(function(e) {
window.setTimeout(function() {
window.console && console.log('Works with clicking on li item and navigating with the keyboard. Yay!');
}, 50);
});
Hay una manera limpia mediante la devolución de llamada updater:
input.typeahead({
'source' : ['foo', 'bar'],
'updater' : function(item) {
this.$element[0].value = item;
this.$element[0].form.submit();
return item;
}
});
Cuando el usuario selecciona una opción (ya sea por clic del ratón o teclado), la devolución de llamada rellena el cuadro de entrada y envía el formulario.
Lamentablemente esta opción brillante, no parece estar presente en construcciones recientes .. –
Si se utiliza el plug-in typeahead.js externa (recomendado para Bootstrap 3):
para desencadenar un formulario en seleccione sólo tiene que utilizar los eventos personalizados.
$('#my-input')
.typeahead({/* put you options here */})
.on('typeahead:selected', function(e){
e.target.form.submit();
});
Más información sobre los eventos personalizados here y demostración sobre JSfiddle.
para rellenar un valor de un campo oculto en un formulario HTML a partir de la selección de datos de escritura siguiente, hice lo siguiente:
$('#prefetch').typeahead({
hint: true,
highlight: true,
minLength: 1
},
{
name: 'trees',
source: trees,
limit: 15
}).on('typeahead:selected', function(e) {
var result = $('#prefetch').val()
$('#formpane input[name=\"myID\"]').val(result)
});
Como referencia, aquí está el código html:
<body>
<div id="formpane">
<form action="/thanks" method="POST">
<input class="typeahead" type="text" placeholder="select categories" id="prefetch">
<button type="submit">Submit</button>
<input type="hidden" name="myID" />
</form>
</div>
<script type="text/javascript" src="js_file_above.js"></script>
</body>
Si Todavía estoy buscando, creé una extensión para el plugin Typeahead para agregar alguna funcionalidad como la que me has preguntado. https://github.com/tcrosen/Bootstrap-Typeahead-Extension – Terry