Question

可能重复：
How to dynamically populate options on dropdown lists based on selection in another dropdown?

我的MySQL表看起来像那样

区域表

id     |   region
-------------------
1      |   Region1
2      |   Region2

...

和学校表

id     |   school
-------------------
1      |   schno1
1      |   schno5
1      |   schno6
2      |   scho120

我的注册表单中有多个选择（下拉菜单）菜单。区域下拉列表看起来像

<td>
<select name="region" id="region">
<option value="">Region</option>
<?php
$result=$db->query("SELECT * FROM regions");
while($row=$result->fetch_array(MYSQLI_BOTH))
{
    echo '<option value="'.$row[0].'">'.$row[1].'</option>';
    }
?>
</select>

</td>
<td>
<div id="sch_dropdown">
<select name="school" id="school">
<option value="">School</option>
</select>
</div>
<span id="loading"><img src="core/design/img/jquery-ui/loading.gif" width="16" height="16" align="absmiddle">&nbsp;Loading...</span>
<div id="no_sch">No schools found</div>
</td>

我想根据之前的选择填充新的下拉列表。我想要做的是，获取“地区”ID，然后在“学校”表中即时填写基于id（之前选择的ID）的学校下拉菜单。这是我的代码，但它不起作用。

我的js看起来像那样

$(document).ready(function(){

function populate() {

       fetch.doPost('core/code/includes/search.php');

}

$('#region').change(populate);

var fetch = function() {

var schools = $('#schools');
return {
    doPost: function(src) {

    $('#loading').show();
    $('#sch_dropdown').hide(); 
    $('#no_sch').hide(); 


        if (src) $.post(src, { region_code: $('#region').val() }, this.getschools);
        else throw new Error('No SRC was passed to getCounties!');
    },

    getschools: function(results) {
        if (!results) return;
        schools.html(results);

    $('#loading').hide(); // Hide the Loading...
    $('#sch_dropdown').show(); // Show the drop down
    }   
}
}();

populate();

});

和search.php

if(isSet($_POST['region_code'])) {
$res=$db->query("SELECT * FROM schools  WHERE id='".$_POST['region_code']."'");
while ($row = $res->fetch_array(MYSQLI_BOTH)) {
echo '<option value="'.$row[0].'">'.$row[1].'</option>';
}
}

请帮我完成它。 Thx提前。

Answer 1

你在没有参数的情况下调用getschools()，所以它什么都不返回。您应该在向search.php文件发出POST请求后传递结果。

编辑：我不确定这是否有效，因为我没有先测试过。但我认为你应该改变

  if (src) $.post(src, { region_code: $('#region').val() }, this.getschools);

到

   if (src) $.post(src, { region_code: $('#region').val() }, function(data){
       getschools(data);
  });

根据先前的选择自动填充下拉列表

1 个答案: