Dynami c html - выберите вариант раскрывающегося списка штата и округа - не удается получить список округов в раскрывающемся списке - PullRequest
0 голосов
/ 24 марта 2020

Я прочитал множество вопросов, опубликованных в этой теме c, и не могу четко увидеть, где я ошибаюсь в своем коде. Я получаю список состояний в моем выпадающем коде опции html -select без проблем. Я следую некоторому коду, который я нашел, используя AJAX, и я действительно думал, что делаю успехи. Все, что я пытаюсь сделать, это onChange значения State, следующий выбор html выберет список только округов в этом состоянии. Я думаю, что проблема заключается в передаче state_id в оператор mySQL SELECT для округов. Любая помощь будет принята с благодарностью.

Вот мой код:

<?php
$sqlState = "SELECT * FROM wp_states ORDER BY state_name";
$resultS = mysqli_query($link,$sqlState);

$sqlCounty = "SELECT * FROM wp_counties WHERE state_id = $_POST[stateId] ORDER BY county_name";
$resultC = mysqli_query($link, $sqlCounty);
?>
<!DOCTYPE html>
<html>
<style>
#formState { width: 35%;}
#formCounty { width: 35%;}  
</style>
<script src="jquery.js"></script>

<body>
<h6>Please select the State and County you would like to play in:</h6>
<form method='POST'>
    <p>Select State
    <select name="formState" id="formState" required>
        <option value="">Type the name of the State you are in</option>
        <?php while($row1 = mysqli_fetch_assoc($resultS)):;?>
        <option value=<?php echo $row1['id'];?>><?php echo $row1['state_name'];?></option>
        <?php endwhile;?>
    </select></p>
    <div id="County">
    <p>Select County
    <select name="formCounty" id="formCounty" required>
        <option value="">Type the name of the County you are in</option>
        <?php while($row1 = mysqli_fetch_assoc($resultC)):;?>
        <option value=<?php echo $row1['id'];?>><?php echo $row1['county_name'];?></option>
        <?php endwhile;?>
    </select></p>
    </div>
    <br>
    <input type="submit" name="submit" value="Select" Style = "color:white; background-color:blue" required>        
</form> 

</body>
</html>
<script>
$(document).ready(function(){
    $('#formState').change(function(){
        var state_id = $(this).val();
        $.ajax({
            url:"",
            method:"POST",
            data:{stateId:state_id},
            dataType:"text",
            success:function(data)
            {
                $('#formCounty').html(data);
            }
        });
    });
});

</script>

Я надеюсь, что моя ошибка в этой строке кода, где я пытаюсь передать state_id из AJAX Функция для оператора SELECT в этой строке кода:

$sqlCounty = "SELECT * FROM wp_counties WHERE state_id = $_POST[stateId] ORDER BY county_name";
$resultC = mysqli_query($link, $sqlCounty);

Вот новый код. Мне нужна помощь с добавлением переменной из функции в операторе SELECT.

<script>    
function changeState(s1,s2){
    var s1 = document.getElementById(s1);
    var s2 = document.getElementById(s2);
    $sqlCounties= "SELECT * FROM wp_counties WHERE state_id =" + s1.value + "ORDER BY county_name ASC";
    $resultC = mysqli_query($_SESSION["link"], $sqlStates);
    return $resultC;
}

</script>   
<body>
<h6>Please select the State:</h6>
<form method='POST'>
    <p>Select State
    <select name="formState" id="formState" onchange="changeState(this.id,'formCounty')" required>
        <option value="">Type the name of the State you are in</option>
        <?php while($row1 = mysqli_fetch_assoc($resultS)):;?>
        <option value=<?php echo $row1['id'];?>><?php echo $row1['state_name'];?></option>
        <?php endwhile;?>
    </select></p>
    <div id="County">
    <p>Select County
    <select name="formCounty" id="formCounty" required>
        <option value="">Type the name of the County you are in</option>
        <?php 
        $resultC = changeCounty();
        while($row1 = mysqli_fetch_assoc($resultC)):;?>
        <option value=<?php echo $row1['id'];?>><?php echo $row1['county_name'];?></option>
        <?php endwhile;?>
    </select></p>
    </div>
    <br>
    <input type="submit" name="submit" value="Select" Style = "color:white; background-color:blue" required>        
</form> 
</body>
</html>
...