Как я могу динамически заполнять раскрывающееся меню в зависимости от другого раскрывающегося меню?

У меня есть два выпадающих меню. Во-первых, вы выбираете страну, а во-вторых, вы должны иметь возможность выбрать город. Города должны быть разными в зависимости от выбранной страны. И страны, и города загружаются из базы данных.

В базе данных есть две таблицы со следующими строками:

  • countries
    • countryId
    • имя
  • cities
    • cityId
    • имя
    • countryId

Это индекс:

<html>
<head></head>
<body>
    <select>
        <?php
            $con=mysqli_connect("localhost","root","","database");
            $result = mysqli_query($con,"SELECT * FROM countries");
            while($row = mysqli_fetch_array($result)) {
                echo '<option value="' .$row['countryId'] .'">' .$row['name'] .'</option>';
            }
        ?>
    </select>
    <br />
    <select>
        <!-- Here goes select from countries -->
    </select>
</body>

How to fill second select?


person user3036943    schedule 23.03.2014    source источник
comment
Вы можете сделать это с помощью ajax.   -  person Dimitrios Kontoulis    schedule 23.03.2014
comment
Обратите внимание, что теги не являются ключевыми словами. Наполнение списка тегов теми же словами, что и в вашем вопросе (html, динамический, раскрывающийся список), не поможет классифицировать его. Обязательно читайте описания, которые появляются при выборе тегов!   -  person Charles    schedule 23.03.2014


Ответы (2)


Поместите какое-нибудь имя для вашего первого выбора, позвольте называть его здесь как first_select и называть второе поле выбора как second_select

Надеюсь, это поможет тебе

<script type="text/javascript">
$(document).ready(function() {

    $("#first_select").change(function() {
        $.get('getcities.php?first_select=' + $(this).val(), function(data) {
            $("#second_select").html(data);
        }); 
    });

});
</script>

<form  method="get">
<select name="first_select" id="first_select">
       <?php
            $con=mysqli_connect("localhost","root","","database") or die(mysqli_error());
            $result = mysqli_query($con,"SELECT * FROM countries") or die(mysqli_error());
            while($row = mysqli_fetch_array($result)) {
                echo '<option value="' .$row['countryId'] .'">' .$row['name'] .'</option>';
            }
        ?>
    </select>

    <select name="second_select" id="second_select"></select>
</form>

Создайте файл с именем getcities.php и

в getcities.php

$first_select= $_GET['first_select'];

$query = mysql_query("select * from cities where countryid = {$first_select}");
while($row = mysql_fetch_array($query)) {
    echo "<option value='$row[cityid]'>$row[name]</option>";
}
person ɹɐqʞɐ zoɹǝɟ    schedule 23.03.2014

Вам нужно будет использовать некоторую условную логику, назначить переменную для выбора, который они делают для своей страны, то есть «countryChoice», затем для вашего второго раскрывающегося списка, иметь еще один оператор while, в котором перечислены все города с помощью countryChoice.

Примерно так:

<html>
<head></head>
<body>
    <form method="post" action="/*YOUR ACTION */">
    <select name='countryChoice' id='countryChoice'>
        <?php
            $con=mysqli_connect("localhost","root","","database");
            $result = mysqli_query($con,"SELECT * FROM countries");
            while($row = mysqli_fetch_array($result)) {
                echo '<option value="' .$row['countryId'] .'">' .$row['name'] .'</option>';
            }
        ?>
    </select>
    <br />
    <select name='cityChoice' id='cityChoice'>
        <?php
            $countryChoice = $_POST['countryChoice'];
            $con=mysqli_connect("localhost","root","","database");
            $result = mysqli_query($con,"SELECT * FROM cities WHERE countryId='$countryChoice'");
            while($row = mysqli_fetch_array($result)) {
                echo '<option value="' .$row['countryId'] .'">' .$row['name'] .'</option>';
            }
        ?>
    </select>
    </form>

You may need to change it a little bit, I haven't worked with this in a while. But, I hope this gives you the right idea.

Или, как упоминалось выше, вы можете использовать Ajax.

person DracoMalfoy    schedule 23.03.2014
comment
Поскольку второе раскрывающееся меню заполнено запросом WHERE, оно заполняется только тем, что есть в первом раскрывающемся списке. - person DracoMalfoy; 23.03.2014
comment
php не будет выполняться во второй раз, кроме ajax - person ɹɐqʞɐ zoɹǝɟ; 23.03.2014
comment
Работает на моем тестовом сайте. - person DracoMalfoy; 23.03.2014
comment
без ajax никто не может выполнить код php второй раз. второе раскрывающееся меню должно измениться при выборе первого значения поля выбора. без ajax мы не сможем этого сделать - person ɹɐqʞɐ zoɹǝɟ; 23.03.2014