Как предотвратить двойное срабатывание события onSelect в jQuery Autocomplete DevBridge

Типичная проблема, которую каждый разработчик Автозаполнение DevQridge JQuery Лица в начале разработки, это очень расстраивает поведение при автозаполнении, когда вы нажимаете на вход, который уже имеет выбранную опцию. Рассмотрим следующий пример:

var countries = [
{ value: 'Andorra', data: 'AD' },
{ value: 'Zimbabwe', data: 'ZZ' }
];
$('#autocomplete').autocomplete({
lookup: countries,
onSelect: function (suggestion) {
alert('You selected: ' + suggestion.value + ', ' + suggestion.data);
}
});

Как только пользователь выберет опцию, обратный вызов onSelect будет запущен, как и ожидалось. Однако, если пользователь снова нажимает на входе, и внутри уже есть опция, обратный вызов снова срабатывает, что, очевидно, нам не нужно. По некоторым причинам это все еще происходит даже в более новых версиях, потому что кажется, что есть люди, которые нуждаются в таком поведении. В моем случае мне это не нужно, поэтому решение было необходимо.

Решение

Решение очень простое, потому что есть опция (которую нелегко найти или понять в документах), по крайней мере, до даты, которая предотвращает такое поведение. Это свойство — triggerSelectOnValidInput, которое в этом случае, я хочу, является ложным:

triggerSelectOnValidInput: false

Таким образом, вы инициализируете автозаполнение с помощью этой опции, чтобы предотвратить проблему:

var countries = [
{ value: 'Andorra', data: 'AD' },
{ value: 'Zimbabwe', data: 'ZZ' }
];
$('#autocomplete').autocomplete({
lookup: countries,
triggerSelectOnValidInput: false,
onSelect: function (suggestion) {
alert('You selected: ' + suggestion.value + ', ' + suggestion.data);
}
});

Теперь обратный вызов будет срабатывать только тогда, когда пользователь что-то ищет и выбирает что-то из выпадающего списка автозаполнения.