Как подставить значение ui autocomplete в onclick?

Question

[viktorross]

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

<input type="text" id="name_load" value=""  />
<input type="submit" onclick="changeLocation("http://site.ru", "name|$значение из того что ввел человек")" />

при нажатии на кнопку нужно запустить этот onclick с тем что ввел пользователь

<script>
        $(function() {
                $( "#name_load" ).autocomplete({
                        source: "{/literal}{$live_site}{literal}/include/get_info.php?type=name_acc",
                        minLength: 1
                });
        });
</script>

как это можно сделать?

Answer 1

[Алексей Попов]

Если я правильно понял то тебе вот сюда Link
Есть такое событие как select он срабатывает при выборе элемента из выпадашки. Да их там не мало если честно. Может поможет.

Comments

[viktorross]

Алексей Попов , спасибо, но оно только между тегами копирует содержимое, например между <span id"Term"></span> это получается также бессмысленно.. т.е мне нужно как-то подставить значение пользователя в событие, возможно Ajax ом, только вот как, я вот думаю
, у меня есть вот такой код который запрашивает информацию из бд

case 'country_acc':

			require_once $config_abs_path."/classes/categories.php";
			if(isset($_GET['term'])) {
			        $term = escape($_GET['term']);
	        		$result = categories::getAutocompleteRegion($term);

				require_once $config_abs_path."/libs/JSON.php";

		        	echo json_encode($result);
			}
			break;

так вот может отсюда же можно как-то сделать запрос Ajax и переменную $term уже вставлять по шаблону где нужно? т.е получается то что пишет пользователь в input записывается в переменную $term, так может ее можно как-то в обратном порядке и получать Аяксом?

[Алексей Попов]

Так смотри тебе нужно сделать вот так?
1. Пишем в поле какой-то текст (к примеру это будут города РФ), нам вылазят подсказки.
2. Мы выбираем вариант Москва.
3. После этого мы жмем на кнопку submit и вызывается функция changeLocation, вторым параметром в эту функцию как раз и уходит название нашего города.
Верно?

[viktorross]

Алексей Попов, да, в точку, уже по разному перепробовал так ничего и не получилось придумать..

[Алексей Попов]

Я припоминаю что делал что-то подобное но уже давно. Попробую накидать код.

$(function() {
                $( "#name_load" ).autocomplete({
                        source: "{/literal}{$live_site}{literal}/include/get_info.php?type=name_acc",
                        minLength: 1,
                        select: function(event, ui){
                           //Убираем старый слушатель события клик при выборе нового значения
                           $('input[type=[submit]]').off('click');
                           setListenerButtonSave(ui);
                        }
                });

                function setListenerButtonSave(ui) {
                   $('input[type=[submit]]').on('click', function () {
                      changeLocation('первый параметр', ui.item.data...что-то там (то есть город, ну или что там у тебя));
                   });
                }
        });

Ну что-то такое, в общем как мне кажется нужно уйти от атрибута onclick у инпута и навестить его через код, при этом каждый раз когда мы навешиваем слушатель события на кнопку, а это происходит каждый раз после выбора значения из селекта мы прокидываем туда ui в котором хранится название города, ну и очищаем предыдущий слушатель со старыми данными если он есть. Могу конечно ошибаться, но мне кажется это более верный вариант решения проблемы.

[viktorross]

Алексей Попов, спасибо, но не понятно самое главное, как сюда вставить выбранный параметр?

$('input[type=[submit]]').on('click', function () {
                      changeLocation('первый параметр', ui.item.data...что-то там (то есть город, ну или что там у тебя));
                   });

т.е вот сюда как четко вставлять значения например чтобы было так?

changeLocation('https://site.ru,  'country|Россия');

как оно туда подставится?

[Алексей Попов]

Для начала нужно понять какое название у конечного поля в объекте где лежит город, я думаю что ui.item.data это неизменная часть, а вот следующее поле может называться уже не city. У меня это было примерно так ui.item.data.city, то есть city был последним полем и в нем уже была строка с городом.
То есть в своем случае я бы сделал вот так

changeLocation('https://site.ru,  'country|' + ui.item.data.city);

Это тебе нужно в событии select поставить console.log(ui); и глянуть какая там структура и потом так и вписать в функцию changeLocation.

[viktorross]

Алексей Попов, я посмотрел в консоле у меня вот здесь выводится то что указано в input

<div contenteditable="plaintext-only">Россия</div>

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

[Алексей Попов]

Ну вот тут я уже мало чем могу помочь. Тут нужно уже капаться в коде и настраивать это дело. Я попытался подсказать тебе возможное решение проблемы, что бы ты уже дальше копал в эту сторону, я то не глядя не могу ничего делать. Увы :(

[viktorross]

Алексей Попов, спасибо в любом случае, буду смотреть дальше что можно придумать)

[Алексей Попов]

Не за что, если совсем ничего не получится, пиши в телегу, может разберемся как-то) Если время будет конечно)