Dynamic Select Box с jQuery, Ajax и PHP - PullRequest
0 голосов
/ 23 мая 2018

Мой код основан на фрагменте из codexworld.com , но у меня есть одна база данных (coin_database) со следующими столбцами:

id|coin_name|coin_country|value
1 |MapleLeaf|Canada      |5dollars
2 |Panda    |China       |10yuan

Я хотел бы создать трехэтапную форму, гдесначала вы выбрали страну, затем тип монет только из этой страны и после этого доступно значение (1 унция, 5 долларов и т. д.).

У меня есть 2 файла: index.php

         <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<script type="text/javascript">
$(document).ready(function(){
    $('#country').on('change',function(){
        var countryID = $(this).val();
        if(countryID){
            $.ajax({
                type:'POST',
                url:'ajaxData.php',
                data:'country='+countryID,
                success:function(html){
                    $('#state').html(html);
                    $('#city').html('<option value="">Select state first</option>'); 
                }
            }); 
        }else{
            $('#state').html('<option value="">Select country first</option>');
            $('#city').html('<option value="">Select state first</option>'); 
        }
    });

    $('#state').on('change',function(){
        var stateID = $(this).val();
        if(stateID){
            $.ajax({
                type:'POST',
                url:'ajaxData.php',
                data:'name='+stateID,
                success:function(html){
                    $('#city').html(html);
                }
            }); 
        }else{
            $('#city').html('<option value="">Select state first</option>'); 
        }
    });
});
</script>


<?php
//Include the database configuration file
include 'db_conn.php';

//Fetch all the country data
$query = $conn->query("SELECT DISTINCT coin_country FROM coin_database ORDER BY coin_country ASC");

//Count total number of rows
$rowCount = $query->num_rows;
?>
<select id="country">
    <option value="">Country</option>
    <?php
    if($rowCount > 0){
        while($row = $query->fetch_assoc()){ 
            echo '<option value="'.$row['coin_country'].'">'.$row['coin_country'].'</option>';
        }
    }else{
        echo '<option value="">Country not available</option>';
    }
    ?>
</select>

<select id="state">
    <option value="">Coin</option>
</select>

<select id="city">
    <option value="">Value</option>
</select>

ajaxData.php

<?php
//Include the database configuration file
include 'db_conn.php';

if(!empty($_POST["country"])){
    //Fetch all state data
    $query = $conn->query("SELECT DISTINCT coin_name, coin_country, value, id FROM `coin_database` WHERE `coin_country` = 'Canada' ORDER BY `coin_name` DESC ");
    //Count total number of rows
    $rowCount = $query->num_rows;

    //State option list
    if($rowCount > 0){
        echo '<option value="">Coin</option>';
        while($row = $query->fetch_assoc()){ 
            echo '<option value="'.$row['id'].'">'.$row['coin_name'].'</option>';
        }
    }else{
        echo '<option value="">Error</option>';
    }
}   

    elseif(!empty($_POST["name"])){
    //Fetch all city data
    $query = $conn->query("SELECT DISTINCT `value` FROM `coin_database` WHERE `coin_name` = 'MapleLeaf' ORDER BY `id` DESC ");

    //Count total number of rows
    $rowCount = $query->num_rows;

    //City option list
    if($rowCount > 0){
        echo '<option value="">Value</option>';
        while($row = $query->fetch_assoc()){ 
            echo '<option value="'.$row['id'].'">'.$row['value'].'</option>';
        }
    }else{
        echo '<option value="">Value not available</option>';
    }
}
?>

Хорошо работает с нединамическими значениями (Канада, MapleLeaf), но я получаю ошибку, когда пытаюсь поместить туда переменную.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...