, manejar el evento seleccionado en twitter bootstrap Typeahead?

Question

Quiero correr función javascript justo después usuario seleccionar un valor usando Twitter arranque TYPEAHEAD

i búsqueda sobre algo como evento seleccionado

Answer 1

$('.typeahead').on('typeahead:selected', function(evt, item) { 
    // do what you want with the item here 
}) 

Answer 2

primera vez que he publicado una respuesta aquí (un montón de veces he encontrado una respuesta aquí), así que aquí está mi contribución, espero que ayude. Debería poder detectar un cambio: intente esto:

function bob(result) { 
    alert('hi bob, you typed: '+ result); 
} 

$('#myTypeAhead').change(function(){ 
    var result = $(this).val() 
    //call your function here 
    bob(result); 
}); 

Answer 3

Creé una extensión que incluye esa característica.

https://github.com/tcrosen/twitter-bootstrap-typeahead

Answer 4

$('.typeahead').typeahead({ 
    updater: function(item) { 
     // do what you want with the item here 
     return item; 
    } 
}) 

Answer 5

Para una explicación de la forma de escritura siguiente funciona para lo que quiere hacer aquí, tomando el ejemplo de código siguiente:

campo de entrada

HTML:

<input type="text" id="my-input-field" value="" /> 

bloque de código JavaScript:

$('#my-input-field').typeahead({ 
    source: function (query, process) { 
     return $.get('json-page.json', { query: query }, function (data) { 
      return process(data.options); 
     }); 
    }, 
    updater: function(item) { 
     myOwnFunction(item); 
     var $fld = $('#my-input-field'); 
     return item; 
    } 
}) 

Explicación:

1. Su campo de entrada se establece como un campo de escritura siguiente con la primera línea: $('#my-input-field').typeahead(
2. Cuando se introduce texto, se dispara la opción source: a buscar a la lista de JSON y mostrarlo a el usuario.
3. Si un usuario hace clic en un elemento (o lo selecciona con las teclas del cursor e intro), ejecuta la opción updater:. Tenga en cuenta que aún no ha actualizado el campo de texto con el valor seleccionado.
4. Puede tomar el elemento seleccionado utilizando la variable item y hacer lo que quiera con él, p. myOwnFunction(item).
5. He incluido un ejemplo de creación de una referencia al campo de entrada en sí $fld, en caso de que quiera hacer algo con él. Tenga en cuenta que no puede hacer referencia al campo usando $ (this).
6. debe luego incluir la línea return item; dentro de la opción updater: por lo que el campo de entrada se actualiza con la variable item.

Answer 6

Según su documentation, la forma correcta de manejar selected evento es mediante el uso de este controlador de eventos:

$('#selector').on('typeahead:select', function(evt, item) { 
    console.log(evt) 
    console.log(item) 
    // Your Code Here 
}) 

Answer 7

source: function (query, process) { 
    return $.get(
     url, 
     { query: query }, 
     function (data) { 
      limit: 10, 
      data = $.parseJSON(data); 
      return process(data); 
     } 
    ); 
}, 
afterSelect: function(item) { 
    $("#divId").val(item.id); 
    $("#divId").val(item.name); 

}