27.10.2023, 00:06
|
Интересующийся
|
|
Регистрация: 07.06.2016
Сообщений: 11
|
|
Вызов Autocomplete по значению в input
С JS не шибко знаком, хуже новичка. Но...
Суть такова: у меня есть два input'а(input1 и input2). К input1 подвязан JQuery Autocomplete, данные подгружаются из JSON, всё работает и проблем нет. Код:
var data = [];
$.getJSON('путь_к_файлу', function(result) {
$.each(result.entries,function(index,val) {
data.push(val);
});
});
$(function(){
$("#id").autocomplete ({
source: data,
minLength: 3
})
.focus(function() {
$(this).autocomplete('search', $(this).val())
});
});
JSON имеет вид:
{
"entries": [
{"label":"text1"},
{"label":"text2"},
{"label":"text3"}
]
}
Как сделать так, чтобы в input2 подгружался другой JSON с Autocomplet'ом, если значение в первом, например, text2?
Либо, как можно разумно модифицировать код и JSON с закосом на будущее, если вдруг понадобится проделывать такую же фигню, когда в input1 будет выбран text1 или text2?
|
|
27.10.2023, 07:33
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
Goopy,
должно быть, как-то так ...
var data = [];
$.getJSON('путь_к_файлу', function(result) {
$.each(result.entries, function(index, val) {
data.push(val);
});
});
$(function() {
$("#id").autocomplete({
source: data,
minLength: 3,
select: function(event, ui) {
$("input2").autocomplete({
source: function(request, response) {
$.ajax({
url: "путь_к_файлу",
dataType: "jsonp",
data: {
term: ui.item.value
},
success: function(data) {
response(data);
}
});
},
minLength: 3
});
}
})
.focus(function() {
$(this).autocomplete('search', $(this).val())
});
});
|
|
27.10.2023, 15:48
|
|
Профессор
|
|
Регистрация: 03.02.2020
Сообщений: 2,745
|
|
рони,
Все равно остается риск, что данные в getJSON придут позже, чем сработает DOMContentLoaded и они понадобятся а source: data
|
|
27.10.2023, 16:15
|
Интересующийся
|
|
Регистрация: 07.06.2016
Сообщений: 11
|
|
рони, благодарю за наводку)
voraa, да, не совсем нормально))) данные не приходят...
буду думать, еще надо условие добавить, чтобы в input2 подгружался JSON, только если значение в Input1 = text3.
|
|
27.10.2023, 19:21
|
|
Профессор
|
|
Регистрация: 03.02.2020
Сообщений: 2,745
|
|
Сообщение от Goopy
|
voraa, да, не совсем нормально))) данные не приходят...
|
С промисом попробуйте
function getJSON() {
return new Promise(res => {
const data = [];
$.getJSON('путь_к_файлу', function(result) {
$.each(result.entries, function(index, val) {
data.push(val);
});
});
res(data);
})
}
const prom = getJson();
$(function() {
prom.then(data => {
$("#id").autocomplete({
source: data,
minLength: 3,
select: function(event, ui) {
$("input2").autocomplete({
source: function(request, response) {
$.ajax({
url: "путь_к_файлу",
dataType: "jsonp",
data: {
term: ui.item.value
},
success: function(data) {
response(data);
}
});
},
minLength: 3
});
}
})
.focus(function() {
$(this).autocomplete('search', $(this).val())
});
})
});
|
|
27.10.2023, 19:37
|
Интересующийся
|
|
Регистрация: 07.06.2016
Сообщений: 11
|
|
второй Json не подгружается, в консоли, вместо него грузится первый Json
|
|
27.10.2023, 19:47
|
|
Профессор
|
|
Регистрация: 03.02.2020
Сообщений: 2,745
|
|
Ну так пути же разные должны быть у первого и второго. Я же не знаю ваши пути.
|
|
27.10.2023, 20:07
|
|
Профессор
|
|
Регистрация: 03.02.2020
Сообщений: 2,745
|
|
Я просто взял код рони, что бы показать как это сделать с промисом.
Там сделано
Сообщение от Goopy
|
с закосом на будущее
|
. Выбранный текст передается на сервер, и уже сервер решает какой JSON послать для второго инпута
|
|
27.10.2023, 20:27
|
Интересующийся
|
|
Регистрация: 07.06.2016
Сообщений: 11
|
|
Сообщение от voraa
|
Ну так пути же разные должны быть у первого и второго. Я же не знаю ваши пути.
|
пути разные к Json'ам)
|
|
27.10.2023, 20:28
|
Интересующийся
|
|
Регистрация: 07.06.2016
Сообщений: 11
|
|
Сообщение от voraa
|
Я просто взял код рони, что бы показать как это сделать с промисом.
Там сделано . Выбранный текст передается на сервер, и уже сервер решает какой JSON послать для второго инпута
|
всё, вкурил, благодарю за помощь)
|
|
|
|