Как сделать появление второго select при выборе значения в первом html\php?

Question

[Ancient Ghoul]

Доброго времени суток. Есть простенькая страница на html с небольшим php скриптом создающим API ссылку для пользователей. Устроено все простенько, однако не пойму как реализовать появление второго, заранее подготовленного select .
На случай если непонятно выразился - необходимый результат:
Есть два INPUT start\end и select Город. Как только пользователь выбирает город - под ним появляется новый select с выбором сервера.

Сразу объяснюсь - я ни разу не разработчик и с html и php знаком крайне посредственно :)

Comments

[ThunderCat]

Сразу объяснюсь - я ни разу не разработчик и с html и php знаком крайне посредственно :)

Тут как бы жс нужен, так что просто "вставить волшебные строчки и все заработает" не получится.

Answer 1

[Okujava-script]

Есть пример для трёх взаимосвязанных селектов:

Страна: <select id="country_id" class="StyleSelectBox">
    <option value="0">- выберите страну -</option>
    <option value="1">Россия</option>
    <option value="2">Украина</option>
    <option value="3">Белорусь</option>
</select>
<br /><br />Регион:
<select id="region_id" disabled>
    <option value="0">- Выберите регион -</option>
</select></td><td>
<br /><br />Город:
<select id="city_id" disabled>
    <option value="0">- Выберите город -</option>
</select>

var all_regions=[];
var all_cites=[[],[],[]];
  
all_regions[0]=["московская обл","ростовская обл","саратовская обл"];
all_regions[1]=["киевская обл","львовская обл","харьковская обл"];
all_regions[2]=["минская обл","брестская обл","гроднинская обл"];
  
all_cites[0][0]=["Москва","Химки","Калуга"];
all_cites[0][1]=["Такой-то город","Такой-то город","Калуга"];
all_cites[0][2]=["Такой-то город","Такой-то город","Такой-то город"];
  
all_cites[1][0]=["Киев","Жмеринка","Бердычев"];
all_cites[1][1]=["Львов","Сокаль","Стрый"];
all_cites[1][2]=["Харьков","Полтава","Пирятин"];
  
all_cites[2][0]=["Минск","Такой-то город","Такой-то город"];
all_cites[2][1]=["Брест","Такой-то город","Такой-то город"];
all_cites[2][2]=["Гродно","Такой-то город","Вильно"];
  
country_id.onchange=function(){
    region_id.disabled=false;
    region_id.innerHTML="<option value='0'>- Выберите регион -</option>";
    myregion=this.value-1;
    if(myregion!=-1){
        for(var i=0;i<all_regions[myregion].length;i++){
            region_id.innerHTML+='<option value="'+(i+1)+'">'+all_regions[myregion][i]+'</option>';
        }
    }else{
        region_id.disabled=true;
        city_id.disabled=true;
    }
}
  
region_id.onchange=function(){
    city_id.disabled=false;
    city_id.innerHTML="<option value='0'>- Выберите город -</option>";
    var mycite=this.value-1;
    if(mycite!=-1){
        for(var i=0;i<all_cites[myregion][mycite].length;i++){
            city_id.innerHTML+='<option value="'+(i+1)+'">'+all_cites[myregion][mycite][i]+'</option>';
        }
    }else{
        city_id.disabled=true;
    }
}

Comments

[Okujava-script]

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

[Ancient Ghoul]

Okujava-script, да мне и без разницы что там за страны, главное пример показательный.
Спасибо, благодаря вам узнал что можно не использовать elem.removeattribute('hidden'), а заменить hidden на disabled и просто поставив на onchange(elem.disabled=false). Может быть, когда нибудь начну изучать JS и PHP полноценно :)

Answer 2

[Adamos]

А РНР здесь и ни при чем. Для этого нужен javascript.
Такая логика называется chained select. Для нее должен работать AJAX-запрос к серверу: в запросе город, в ответе - список серверов. Либо, если список не слишком велик, эти данные можно сразу включить в страницу и просто выбирать нужные по событию изменения первого select.

Comments

[Ancient Ghoul]

Я PHP отметил руководствуясь логикой "возможно, есть способ написать цикл в духе if (empty(mixed $_CITY) = false) echoServerSelectToForm($_CITY)
Есть ли способ реализовать подобное или только подключать AJAX?
Список небольшой, около 10 пунктов.

[Adamos]

Ancient Ghoul, для небольшого списка AJAX не требуется, но для интерактива на странице (обновление второго списка при выборе на первом) javascript необходим.

[Ancient Ghoul]

Adamos, можете посоветовать сайт на подобие php.net под js?

[Adamos]

Ancient Ghoul, довольно трудно не найти в рунете https://learn.javascript.ru/

[Ancient Ghoul]

Adamos, благодарю)

Answer 3

[Владимир Коротенко]

Логика следующая.
Есть 3 селекта страна регион город
Со стороны php проверяется наличие параметров country region city
По умолчанию регион и город скрыты то есть не выводятся в разметке. При наличии в get запросе параметра страна отображается список регион и так далее.
Пример запроса

Select.php
Select.php?country=ru
Select.php?country=ru&region=31
Select.php?country=ru&region=31&city=309530

Последний возвращает Россия Белгородская область г. Старый Оскол

Comments

[Kirgus]

А зачем делать это на PHP, если можно ограничиться фронтом?

[Владимир Коротенко]

Кирилл Гусарев, вы представляете себе сколько кода получится для этого?
плюс еще поисковикам легче

Answer 4

[jeka-ekb]

Подскажите, а как можно сделать определенный текстовый вывод результата после выбора из трех селектов ?
Например: Тут живет ХХХ человек.