使用 jquery 动态选择下拉菜单

Question

我有一个包含两个选择下拉列表的文章插入表单。一个用于部分，另一个用于子部分。第一个选择标记是正确的。当用户选择一个部分时，应显示其子部分。我想用 ajax 完成这项工作，但没有任何反应。我搜索并找到了一些关于此的示例，但是他们都不能解决我的问题。

查看

<script type='text/javascript'>
$(document).ready(function(){
$('#subsec').hide();
$('section').change(){
var sec_id=$(this).val();
var url='article_controler/get_options/'+sec_id;
$.ajax({
$('#subsec').show();
url:url,
type:'post',
success:function(resp){
$.each(resp,function(subsec_name)){
var opt=$('<option/>');
opt.val(subsec_name);
opt.text(subsec_name);
$('#subsec').append(opt);
}
})
}

});
</script>
<select id='section'>
<?php foreach($sec->result() as $row) {?>
<option value='<?php echo $row->sec_id ?>'><?php echo $row->sec_name ?></option>
<?php } ?>
</select>
<select id='subsec'>
<option value=''></option>
</select>

控制器

function get_options($sec_id){
$data['opt']=$this->article_model->get_options($sec_id);
$this->load->view('insert_art',$data);}    

型号

function get_options($sec_id){
$query=$this->db->query('select * from subsection where sec_id='.$sec_id);
return $query;    

我知道可能会有很多错误，因为这是我第一次使用 jquery 和 ajax。

Answer 1

更改网址

var url=<?php echo base_url(); ?>'article_controler/get_options/'+sec_id;

ajax 成功

success:function(resp){
$('#subsec').html(resp);
}

在控制器中

function get_options($sec_id){
 $data['opt']=$this->article_model->get_options($sec_id);
 foreach($data['opt'] as opt){
  echo "<option value=".$opt['sub_sec_id'].">".$opt['sub_sec_name']."</option>";
 }
} 

在模型中

function get_options($sec_id){
$query=$this->db->query('select * from subsection where sec_id='.$sec_id);
return $query->result_array(); }