如何使用 Ajax 和 Codeigniter 在 'onchange' 事件上更新 div 内容

How to update div contents on 'onchange' event using Ajax and Codeigniter

我在 WAMP.In 我的观点之一 (our_districts.php) 上使用 CodeIgniter v3.1.3,我有一个包含地区名称的下拉列表:

<select class="form-control" id="ddlDist" name="ddlDist" onchange="popDistrictData();">
    <option value="0">--Select--</option>
    <option value="3">District A</option>
    <option value="4">District B</option>
    <option value="5">District C</option>
    <option value="6">District D</option>
</select>
<div id="districtData"></div>
<script type="text/javascript">
    function popDistrictData(){
        var dist_id = document.getElementById("ddlDist").value;
        $.ajax({
            type: "POST",
            url: "<?=site_url()?>section/ajax_call_pop_district_data/"+dist_id,
            dataType: "html",
            success: function(html){
                $("#districtData").html(html);
            }
        });
    }
</script>

部门负责人:

class Section extends CI_Controller {
    public function __construct()
    {
        parent::__construct();
        $this->output->set_header('Content-Type:text/html; charset=UTF-8');
        $this->load->helper("url");
        $this->load->model("District_model");
    }
    public function view()
    {
        $data['section_name']='Districts';
        $this->load->view('templates/site_header',$data);
        $data["district_data"] = $this->District_model->pop_districts_in_combobox();
        $this->load->view('our_districts',$data);
        $this->load->view('templates/site_footer',$data);   
    }

    public function ajax_call_pop_district_data()
    {
        if ($this->input->post('distId') !="") {
            $did = $_POST['distId'];
            $dist_data = $this->District_model->pop_district_data($did);
            //what should i write here???.........
        }
    }
}

如您所见,上面的下拉列表由 'District_model''pop_districts_in_combobox()' 方法填充。在其 'onchange' 事件中, 我想使用 Ajax 使用 id=districtData 填充 div,如图所示 above.My 问题是如何填充 div(id=districtData)。请提前帮助一些 code.Thanks .

您正在进行 ajax 调用,因此 ajax 应该 return 将处理 jQuery $.ajax 函数的代码。

在您的 jQuery 成功函数代码中,您正在做一个简单的 $("#districtData").html(html);

所以在控制器函数中 ajax_call_pop_district_data 你应该做一个 simple echo $dist_data 它应该有 html 由模型函数生成的代码 pop_district_data