使用Codeigniter通过Ajax显示数据

Question

我是ajax的新手。无法识别我如何获得所需的输出。 我实现了依赖下拉列表。 问题是，当我从下拉菜单中选择区域时，我无法显示该区域的餐厅。 请告诉我如何获得餐厅景观。

这是我的查看代码

<div class="container"id restaurant>


        <table align="centre" class="table table-condensed table-striped table-hover no-margin"style="width:70%">
            <thread>
                <tr style="width: 56%;">
                    <th>
                        No.
                    </th>
                    <th style="">
                        Restaurant Names
                    </th>
                </tr>
            </thread>
            <tbody>
            <?php $i=1;foreach($result as $row){
                ?>
                <tr id="<?php echo $row->restaurant_id; ?>" class="res_id">
                    <th style="">
                        <?php echo  $i++; ?>

                    </th>
                    <th style="">
                        <?php echo $row->restaurant_name; ?>

                    </th>
                    <th style="width: 1%" >
                        <a href="<?php echo base_url();?>index.php/BulkRecipe_Controller/bulk_recipe/<?php echo $row->restaurant_id;?>"  class="btn btn-warning" <i class="glyphicon-edit"></i>See Menu</a>
                    </th>
                </tr>
            <?php } ?>
            </tbody>
        </table>
    </div>

它是我的控制者代码

     public function get_rests()
    {

        $cit_id = $this->input->post('cit_id');
        $area = $this->input->post('areaID');
        $where = array('city_id'=>$cit_id,'city_area_id'=>$area);

        $data = $this->bulk->select_record('restaurant',$where);
        echo $data = json_encode($data);
}

它的脚本代码

function get_rests(){

        var city_id = $('#city_id').val();
        var area_id = $("#area_id").val();
        $.ajax({
            type: "POST",
            url: "<?=base_url();?>index.php/Bulk_Controller/get_rests",
            data: {cit_id: city_id,areaID: area_id},
            dataType: "text",
            cache:false,
            success:
                function(data){
                    $('#restaurant').html(data);
                }
        });
    }

其型号代码

function select_record($table, $where = NULL){

    $this->db->select();
    if($where)
        $this->db->where($where);
    $this->db->from($table);
    $query = $this->db->get();
    return $query->result();
}

选择区域后的前端视图

Answer 1

 public function get_rests()
 {

    $cit_id = $this->input->post('cit_id');
    $area = $this->input->post('areaID');
    $where = array('city_id'=>$cit_id,'city_area_id'=>$area);

    $data = $this->bulk->select_record('restaurant',$where);
    echo  json_encode($data); // you will get json encoded data in your ajax success then you can parse the json using jquery and get the detail
}

Answer 2

尝试在控制器中制作数据的html并显示在下拉列表中。

 public function get_rests()
    {

        $cit_id = $this->input->post('cit_id');
        $area = $this->input->post('areaID');
        $where = array('city_id'=>$cit_id,'city_area_id'=>$area);

        $data = $this->bulk->select_record('restaurant',$where);
       $html = 'your result';
  echo $html;

}

现在，在ajax部分中，您可以执行以下操作：

function get_rests(){

        var city_id = $('#city_id').val();
        var area_id = $("#area_id").val();
        $.ajax({
            type: "POST",
            url: "<?=base_url();?>index.php/Bulk_Controller/get_rests",
            data: {cit_id: city_id,areaID: area_id},
            dataType: "text",
            cache:false,
            success:
                function(data){
                    // alert(data);
                    $('#restaurant').html(data);
                }
        });
    }

有关如何使用ajax选择和查看数据的更多信息，请检查此链接。