Bootstrap просто реализовал аккуратную функцию автозаполнения, называемую typeahead. У меня возникают проблемы с получением соответствующего значения для ввода текста.
Например, у меня может быть следующее:
$('input').on('change', function(){
console.log($(this).val());
});
Это не означает, что вы выбрали выбранное значение. Кто-нибудь знает, как получить выбранное значение с помощью typeahead с помощью Bootstrap?
$('#autocomplete').on('typeahead:selected', function (e, datum) {
console.log(datum);
});
$('#autocomplete').on('typeahead:cursorchanged', function (e, datum) {
console.log(datum);
});
Кажется, что Typeahead изменил слушателей, и их использование плохо документировано. Вы можете использовать этих слушателей.
ОБНОВИТЬ
Имя события было изменено на typeahead:select в более поздних версиях.
Вы смотрите на него с неправильного угла. Метод bootstrap typeahead предоставляет опцию, которая позволяет передать функцию обратного вызова, которая принимает выбранное значение в качестве аргумента. Ниже приведен сжатый пример, иллюстрирующий только этот один аргумент.
$('#typeaheadID').typeahead({
updater: function(selection){
console.log("You selected: " + selection)
}
})
Я работаю с этим, и сейчас у меня такая же проблема. Я планирую решить эту проблему с помощью этой красивой вилки
https://gist.github.com/1891669
И я сделал это с обратным вызовом:
$('.typeahead').typeahead({
// note that "value" is the default setting for the property option
source: [{value: 'Charlie'}, {value: 'Gudbergur'}, ...],
onselect: function(obj) { console.log(obj) }
})
Надеюсь, что это тоже поможет.
Если у вас только 1 на странице, вы можете попробовать $('ul.typeahead li.active').data('value');, но у вас могут быть проблемы, если на странице больше 1.
Интересно, есть ли причина, по которой входное значение не задано?
$('#myselector').typeahead({
itemSelected:function(data,value,text){
console.log(data)
alert('value is'+value);
alert('text is'+text);
},
//your other stuffs
});
Вам нужно просто передать itemSelected в функции обратного вызова, и он предоставит вам выбранный элемент.
Надеюсь, это сработает для вас.
Если вы используете другую кнопку для работы с выбранным элементом или хотите получить этот элемент сразу после обновления, вы можете использовать $("#your_input").next("ul").find("li.active").data("value"); для получения значения.
Работа для ajax bootstrap typeahead.