在codeigniter中使用模态显示详细数据

时间:2015-06-30 08:46:45

标签: twitter-bootstrap codeigniter

我有项目,在管理页面中我想使用bootstrap中的modal来显示详细数据。我使用codeigniter。所以这里有人有教程吗?

我想使用模态显示详细数据和编辑数据,所以我不需要再次制作另一页。 这是我的模型

function get_user_by($id){
    $this->db->where('id', $id);
    $query = $this->db->get('user');
    return $query->result_array();
}

这是我的控制器

    function view_user($id){
    $akun = $this->admin_model->get_user_by($id);
    if ($akun[0]['foto']!='') {
            $foto = $akun[0]['foto'];
        }else{
            $foto = 'default-avatar.png';

        }
        $data = array(
            'id'=>$akun[0]['id'],
            'nama' => $akun[0]['nama_lengkap'],
            'username' => $akun[0]['username'],
            'foto' => $foto,
            'jenis_kelamin'=> $akun[0]['jenis_kelamin'],
            'pekerjaan'=> $akun[0]['pekerjaan'],
            'tempat_lahir'=>$akun[0]['tempat_lahir'],
            'tgl_lahir'=> $akun[0]['tanggal_lahir'],
            'gol_darah'=>$akun[0]['golongan_darah'],
            'alamat'=>$akun[0]['alamat'],
            'kota'=>$akun[0]['kota'],
            'provinsi'=>$akun[0]['provinsi'],
            'pendidikan_terakhir'=>$akun[0]['pendidikan_terakhir'],
            'no_telepon'=>$akun[0]['no_telepon'],
            'agama'=>$akun[0]['agama'],
            'email'=>$akun[0]['email'],
        );
}

这是我在按钮中显示详细数据的代码

查看

<a href="" title="" class="detail_user" ></a><button type="button" data-toggle="modal" data-target="#myModal" data-id="<?php echo $row->id; ?>" class="btn btn-primary" >View</button>

这是我的javascript

    $('#myModal').on('show.bs.modal', function (event) {
      var button = $(event.relatedTarget) // Button that triggered the modal
      var recipient = button.data('id') // Extract info from data-* attributes
      var modal = $(this);
      var dataString = 'id=' + recipient;

        $.ajax({
            type: "GET",
            url: "<?php echo site_url();?>admin/view_user",
            data: dataString,
            cache: false,
            success: function (data) {
                console.log(data);
                modal.find('.ct').html(data);
            },
            error: function(err) {
                console.log(err);
            }
        });  
})

0 个答案:

没有答案