JQuery UI Autocomplete c minLength: 0 не правильно работает

@Prorab337 · Регистрация: 25.05.2015

Студворк — интернет-сервис помощи студентам

Добрый день. Есть autocomplete прикрученный к input. После события change это поле перезагружается. В итоге на обновленном input уже не работает autocomplete. Решил вешать autocomplete после ajaxStop. + важный момент чтобы после клика в input подгружались все варианты. Все сделал, все работает отлично. Только есть неприятный момент - если кликать в input, потом за ним, потом снова в нем то получается autocomplete срабатывает не 1 раз а плодиться с каждым кликом. Уже разные варианты пробовал, может кто что подскажет?

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
$(function() {
        
        $(document).ajaxStop( function() {
            
            $('input[name *= city]').autocomplete({
                minLength: 0,
                source: function(request, response){
                    console.log('get');
                    shippingData.getAddress('getCities', request.term).done( function() {
                        response($.map(shippingData.src, function(item) {
                            return {
                                label: item['Description'],
                                value: item['Description']
                            }
                        } ));
                    } );    
                },
                select: function(e, u) {
                    var old_value = $(this).val();
                    
                    $(this).val(u.item.value);
                    
                    if (u.item.value != old_value) {
                        $(this).trigger('change');
                    }
                },
                position: {
                    'my': 'right top', 
                    'at': 'right bottom'
                }
            } )
            .on('click', function() {
                $(this).autocomplete('search', '');
            } );
            
        } );
    
    });

mixenik · 09.01.2016, 11:28

Используйте делегирование событий. Использование ajaxStop неоправдано, ибо он будет выполнятся при КАЖДОМ ajax запросе, даже не относящемуся к данному коду. Поэтому-то у вас и отрабатывает несколько раз, потому что обработчик вешается на блок каждый раз, когда заканчивается ЛЮБОЙ ajax запрос

@Prorab337 · 09.01.2016, 16:28 **[ТС]**

mixenik, без ajax аналогично. Я имею ввиду

JavaScript
1
2
3
 .on('click', function() {
                $(this).autocomplete('search', '');
            } );

После каждого клика вешается обработчик. В итоге если я хочу открыть весь список не 1 раз, то autocomplete выполняется уже +1 раз. Открыл список 10 раз допустим, в итоге на 11е открывание списка 12 запросов

mixenik · 09.01.2016, 16:35

Код без ajax можете показать?

@Prorab337 · 09.01.2016, 18:05 **[ТС]**

mixenik, да

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
$(document).on('focus', 'input[name *= city]', function() {
            
            $(this).autocomplete({
                minLength: 0,
                source: function(request, response){
                    console.log('get');
                    shippingData.getAddress('getCities', request.term).done( function() {
                        response($.map(shippingData.src, function(item) {
                            return {
                                label: item['Description'],
                                value: item['Description']
                            }
                        } ));
                    } );    
                },
                select: function(e, u) {
                    var old_value = $(this).val();
                    
                    $(this).val(u.item.value);
                    
                    if (u.item.value != old_value) {
                        $(this).trigger('change');
                    }
                },
                position: {
                    'my': 'right top', 
                    'at': 'right bottom'
                }
            } )
            .on('click', function() {
                $(this).autocomplete('search', '');
            } );
            
        });

mixenik · 09.01.2016, 18:14

Логично, каждый раз отрабатывает событие focus, у вас заново вешается обработчик клика на этот элемент.
вынесите on('click') из функции, т.е. сделайте отдельное делегирование для инпутов.
И, да, не стоит делать делегирование на document, ибо у вас все события фокуса будут всплывать к нему, что замедлит работу. Если у инпутов есть статический контейнер (не подгружаемый ajax-м), то делайте делегирование на него.

@Prorab337 · 09.01.2016, 18:34 **[ТС]**

mixenik, спасибо

. Чет не доплыл до этого)))
document - это я чтоб наверняка, перегружаются на странице почти все блоки. Код сторонний, еще не вникал детально. А так конечно)

Новые блоги и статьи Все статьи Все блоги /
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Access VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .	Ломающие изменения в C#.NStar Alpha Etyuhibosecyu 20.11.2025 Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .	Мысли в слух kumehtar 18.11.2025 Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .	Создание Single Page Application на фреймах krapotkin 16.11.2025 Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .

mixenik Все элементарное - сложно 133 / 118 / 50 Регистрация: 14.04.2014 Сообщений: 509
	09.01.2016, 11:28
	Используйте делегирование событий. Использование ajaxStop неоправдано, ибо он будет выполнятся при КАЖДОМ ajax запросе, даже не относящемуся к данному коду. Поэтому-то у вас и отрабатывает несколько раз, потому что обработчик вешается на блок каждый раз, когда заканчивается ЛЮБОЙ ajax запрос 1

mixenik Все элементарное - сложно 133 / 118 / 50 Регистрация: 14.04.2014 Сообщений: 509
	09.01.2016, 16:35
	Код без ajax можете показать? 0

mixenik Все элементарное - сложно 133 / 118 / 50 Регистрация: 14.04.2014 Сообщений: 509
	09.01.2016, 18:14
	Сообщение было отмечено Prorab337 как решение Решение Логично, каждый раз отрабатывает событие focus, у вас заново вешается обработчик клика на этот элемент. вынесите on('click') из функции, т.е. сделайте отдельное делегирование для инпутов. И, да, не стоит делать делегирование на document, ибо у вас все события фокуса будут всплывать к нему, что замедлит работу. Если у инпутов есть статический контейнер (не подгружаемый ajax-м), то делайте делегирование на него. 1

@Prorab337 11 / 0 / 4 Регистрация: 25.05.2015 Сообщений: 40
	09.01.2016, 18:34 [ТС]
	mixenik, спасибо. Чет не доплыл до этого))) document - это я чтоб наверняка, перегружаются на странице почти все блоки. Код сторонний, еще не вникал детально. А так конечно) 0

JQuery UI Autocomplete c minLength: 0 не правильно работает

Решение