1

最初のドロップダウンの選択後に 2 番目のドロップダウンのオプションが変化する動的なドロップダウンを作成したいと考えています。

test.php ファイル

<?php
$con=mysqli_connect("localhost","******","****","******");
// Check connection
if (mysqli_connect_errno())
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

$result = mysqli_query($con,"SELECT * FROM countries");
?>
<select id="country" name='country' onchange="get_states();">
<option value=''>Select</option>
<?php
while($row = mysqli_fetch_array($result))
{
echo "<option value='" . $row['country_id'] . "'>" . $row['country_name'] . "</option>";
}
?>
</select>
<div id="get_state"></div> // Sub will be appended here using ajax

<script type="text/javascript">
function get_states() { // Call to ajax function
var country = $('#country').val();
var dataString = "country="+country;
$.ajax({
    type: "POST",
    url: "getstates.php", // Name of the php files
    data: dataString,
    success: function(html)
    {
        $("#get_state").html(html);
    }
});
}
</script>
<?php
mysqli_close($con);
?>

そしてgestates.phpは次のとおりです。

<?php if ($_POST) {
$country = $_POST['country'];
if ($country != '') {
   $sql1 = "SELECT * FROM states WHERE country_id=" . $country;
   $result1 = mysql_query($sql1);
   echo "<select name='state'>";
   echo "<option value=''>Select</option>"; 
   while ($row = mysql_fetch_array($result1)) {
      echo "<option value='" . $row['id'] . "'>" . $row['state_name'] . "</option>";}
   echo "</select>";
}
else
{
    echo  '';
}
}
?>

ただし、上記のコードは機能しません。

4

2 に答える 2

0

最初のドロップダウンの変更時に、オプションを取得する ajax 呼び出しを行う必要があり、次のドロップダウンに入力できます

于 2013-10-25T19:47:16.373 に答える
0

$country を一重引用符で囲んでみてください

$sql1 = "SELECT * FROM states WHERE country_id='" . $country . "'";

また

$sql1 = "SELECT * FROM states WHERE country_id='$country'";

編集: また、エコーできる結果は 1 つだけです。最初のエコーは成功と見なされるため、2 番目のエコーは Jquery によって無視されます。

結果を別の方法でフォーマットする必要があります。

おそらくjsonでエンコードされた配列です。

あなたのphpで：

while($row = mysql_fetch_array($result1))
{
      $data[$row['id']] = $row['state_name'];
}

echo json_encode($data);

Jquery で dataType: 'json' を設定します。

$.each(html,function(key,value){

      $("#get_state").append($('<option>',{ 
               value:key,
           text: value
    }));
});
于 2013-10-25T19:51:16.523 に答える