在动态下拉列表中使用ajax时找不到php

Question

在我的php代码中，我有两个下拉列表，这两个下拉列表取决于第一个下拉列表。

这里是第一下拉：

<select class="form-control style" id="sel" > 
    <option style="color: black;" >Select...</option> 
    <?php foreach ($dtype as $row) { ?> 
    <option style"color:black;" value="<?php echo $row['donations_type_id'];?>"> <?php echo $row['donations_type_name'];?></option> 
    <?php }?>        
</select> 
<tr> 
<td>Available Donation:</td> 
<td style="color: black; "> 
    <select name='avail' id='avail' class="form-control style" > 
     <option style="color:black;" value="">Select...</option>      
    </select> 
</td> 
</tr> 

第二下拉菜单可显示对应无论用户从第一个下拉选择数据。

这里的脚本：

<script type="text/javascript"> 
$(document).ready(function(){ 
$("#sel").change(function(){ 
    $.ajax({   
    data: {id: $(this).val()}, 
    type: "POST", 
    url:"<?= base_url() ?>BeneficiaryModule/showAvailable/"+ $(this).val(), 
    success:function(data){ 
    $("#avail").html(data); 
    }  
    }); 
}); 
}); 
</script> 

在我的控制器：

public function showAvailable() 
    { 
    echo $id = $this->input->post('id', true); 
    $data['package'] = $this->Beneficiary_model->getDtype($id); 
    $output = null; 
    foreach ($data['package'] as $row) { 
     $output.="<option value='".$row->package_id."'>".$row->package_name."</option>"; 
    } 
    echo $output;   
} 

而且在我的模型：

public function getDtype($id){ 
    $this->db->select('package_id','package_name'); 
    $this->db->from('package_table'); 
    $this->db->where('package_type', $id); 
    $query = $this->db->get(); 
    return $query->result(); 
} 

当我试图运行到F12代码并进行调试它显示那里POST http://localhost:8999/samp/sampModule/showAvailable/2 404 (Not Found)

为什么？

任何人都可以帮我解决这个错误吗？

Answer 1

$("#sel").change(function(){ 
    $.ajax({   
     data: {id: $(this).val()}, 
... 
     url:"<?= base_url() ?>BeneficiaryModule/showAvailable/"+ $(this).val(), 

采取$(this)出ajax对象。它现在指向了ajax对象本身。尝试：

$("#sel").change(function(){ 
    var _id = $(this).val(); 
    $.ajax({   
     data: {id: _id}, 
... 
     url:"<?= base_url() ?>BeneficiaryModule/showAvailable/"+ _id,  

**UPDATED** 

此外，如果从服务器接收到的数据正确，但下拉仍然没有呈现，该问题可能是与dataType财产。可能有一些问题与响应MIME类型，导致与Intelligent Guess和数据问题作为json或xml字符串处理，所以你可以尝试将其设置明确的：

$("#sel").change(function(){ 
    var _id = $(this).val(); 
    $.ajax({   
     data: {id: _id}, 
     type: "POST", 
     dataType: 'html', 
     url:"<?= base_url() ?>BeneficiaryModule/showAvailable/"+ _id, 
     success:function(data){ 
      $("#avail").html(data); 
     }  
    }); 

});