Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 27.10.2023, 00:06
Интересующийся
Отправить личное сообщение для Goopy Посмотреть профиль Найти все сообщения от Goopy
 
Регистрация: 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?
Ответить с цитированием
  #2 (permalink)  
Старый 27.10.2023, 07:33
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

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())
                });
        });
Ответить с цитированием
  #3 (permalink)  
Старый 27.10.2023, 15:48
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,750

рони,
Все равно остается риск, что данные в getJSON придут позже, чем сработает DOMContentLoaded и они понадобятся а source: data
Ответить с цитированием
  #4 (permalink)  
Старый 27.10.2023, 16:15
Интересующийся
Отправить личное сообщение для Goopy Посмотреть профиль Найти все сообщения от Goopy
 
Регистрация: 07.06.2016
Сообщений: 11

рони, благодарю за наводку)

voraa, да, не совсем нормально))) данные не приходят...

буду думать, еще надо условие добавить, чтобы в input2 подгружался JSON, только если значение в Input1 = text3.
Ответить с цитированием
  #5 (permalink)  
Старый 27.10.2023, 19:21
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,750

Сообщение от 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())
            });

    })
});
Ответить с цитированием
  #6 (permalink)  
Старый 27.10.2023, 19:37
Интересующийся
Отправить личное сообщение для Goopy Посмотреть профиль Найти все сообщения от Goopy
 
Регистрация: 07.06.2016
Сообщений: 11

второй Json не подгружается, в консоли, вместо него грузится первый Json
Ответить с цитированием
  #7 (permalink)  
Старый 27.10.2023, 19:47
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,750

Ну так пути же разные должны быть у первого и второго. Я же не знаю ваши пути.
Ответить с цитированием
  #8 (permalink)  
Старый 27.10.2023, 20:07
Аватар для voraa
Профессор
Отправить личное сообщение для voraa Посмотреть профиль Найти все сообщения от voraa
 
Регистрация: 03.02.2020
Сообщений: 2,750

Я просто взял код рони, что бы показать как это сделать с промисом.
Там сделано
Сообщение от Goopy
с закосом на будущее
. Выбранный текст передается на сервер, и уже сервер решает какой JSON послать для второго инпута
Ответить с цитированием
  #9 (permalink)  
Старый 27.10.2023, 20:27
Интересующийся
Отправить личное сообщение для Goopy Посмотреть профиль Найти все сообщения от Goopy
 
Регистрация: 07.06.2016
Сообщений: 11

Сообщение от voraa Посмотреть сообщение
Ну так пути же разные должны быть у первого и второго. Я же не знаю ваши пути.
пути разные к Json'ам)
Ответить с цитированием
  #10 (permalink)  
Старый 27.10.2023, 20:28
Интересующийся
Отправить личное сообщение для Goopy Посмотреть профиль Найти все сообщения от Goopy
 
Регистрация: 07.06.2016
Сообщений: 11

Сообщение от voraa Посмотреть сообщение
Я просто взял код рони, что бы показать как это сделать с промисом.
Там сделано . Выбранный текст передается на сервер, и уже сервер решает какой JSON послать для второго инпута
всё, вкурил, благодарю за помощь)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Принудительный вызов события input MC-XOBAHCK Общие вопросы Javascript 2 25.09.2018 20:02
Прошу помощи, вызов нескольких функций из input, ajax alagor Общие вопросы Javascript 2 10.02.2016 17:35
Вызов события для input file ArmagedDance jQuery 4 17.02.2013 10:39
При добавлении DOCTYPE "плывут" размеры input type=text Demath (X)HTML/CSS 4 08.07.2012 19:27
Автодополнение в input, типа autocomplete, но не совсем это. zero_mod jQuery 1 19.11.2010 13:04