@pustbay

Как решить проблему с Jquery Autocomplete при заполнении нескольких полей?

Необходимо сделать скрипт автозаполения полей input когда пользователь вводит адрес.

Для этого написал php-скрипт который используя REST API сервиса Ahunter.ru (ahunter.ru/site/doc/api/suggest/address) собирает подсказки для вводимого пользователем адреса, обрабатывает их и формирует массив в формате JSON, для его последующей обработки Jquery Autocomplete

Проблемы возникли при написании скрипта на Jquery для ajax-запроса к php-скрипту. Код скрипта на Jquery:


<script type="text/javascript">
 
 $('.address').each(function(){
 
$(this).autocomplete({ source: function(request,response) {
	
 var val =  $('.address').val();
 
        	
	$.getJSON('http://doc.army-help.ru/files/1.php?query=' + val,  function(data){
     	
    	var suggestions = []; // массив для хранения результатов
    	$.each(data, function(key, val) {
                 	
            	suggestions.push(val.value); // добавляем все элементы
        	});
            response(suggestions);
    	});
        	
	} 	
});
 
 
});
 
</script>


Скрипт работает, но проблема заключается в том, что для обработки нескольких полей с классом address на странице используется функция .each. При этом обрабатываются все поля но данные для переменной val (в нее помещается введенные пользователем данные) берутся только из 1-го по порядку класса address.

!!! ВОПРОС:

Не понимаю как заполнять переменную val содержанием именно того input, который заполняет пользователь. Пробовал варианты - var val = $(this).val(); и var val = this.value; но они не работают.

Адрес php-скрипта - doc.army-help.ru/files/1.php?query=%D0%BD%D0%B8%D0...

Адрес страницы с ajax-скриптом - doc.army-help.ru/files/2.php
  • Вопрос задан
  • 85 просмотров
Решения вопроса 1
lamer350
@lamer350
กำลังสูงสุด
В данном случае обходить все поля неправильно, each тут не помощник.
Правильно будет отслеживать ввод данных в поле и тут же обрабатывать из него данные
$('body').on('keyup', '.address', function(){
 var item = $(this);
item.autocomplete({ source: function(request,response) {
 var val = item.val();
 $.getJSON('http://doc.army-help.ru/files/1.php?query=' + val,  function(data){
     	
    	var suggestions = []; // массив для хранения результатов
    	$.each(data, function(key, val) {
                 	
            	suggestions.push(val.value); // добавляем все элементы
        	});
            response(suggestions);
    	});
        	
  } 	
});
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы