Question

我遵循了this web上的教程，以在modal_bootsrap中显示数据。在本教程中，有一个使用modal_bootstrap编辑数据的操作，而我想使用该部分显示数据行的详细信息。我想以模态显示数据表，如下图：

此表格为模态：

                <div class="modal-body">
                   <table>
                     <tr>
                       <th>Kode Rumah Jaga</th>
                       <td name="field1">RJ01</td>
                     </tr>
                     <tr>
                       <th>Daerah Irigasi</th>
                       <td name="field2">Gebong</td>
                     </tr>
                     <tr>
                         <th>Juru Pengairan</th>
                         <td name="field3">Gebong 1</td>
                     </tr>
                     <tr>
                         <th>Nama Rumah Jaga</th>
                         <td name="field4">Gebong</td>
                     </tr>
                     <tr>
                         <th>Petugas</th>
                         <td name="field5">Nasardi</td>
                     </tr>
                     <tr>
                         <th>Kecamatan</th>
                         <td name="field6">-</td>
                     </tr>
                     <tr>
                         <th>Desa</th>
                         <td name="field7">-</td>
                     </tr>
                     <tr>
                         <th>Dusun</th>
                         <td name="field8">-</td>
                     </tr>
                     <tr>
                         <th>Tahun Pembuatan</th>
                         <td name="field9">-</td>
                     </tr>
                     <tr>
                         <th>Tahun Renovasi</th>
                         <td name="field10">-</td>
                     </tr>
                 </table>

查看我的Ajax：

<script type="text/javascript">
        $(document).ready(function() {
           $('#rj-table').DataTable({
              "ajax": {
                url : "<?php echo site_url("main/rj_page") ?>",
                type : 'GET'
             },
           });
        });

        function view_detail(id){
            //Ajax Load data from ajax
            $.ajax({
                url : "<?php echo site_url('main/ajax_view')?>/" + id,
                type: "GET",
                dataType: "JSON",
                success: function(data)
                {
                    $('[name="field1"]').val(data.id_rumahjaga);
                    $('[name="field2"]').val(data.daerahirigasi);
                    $('[name="field3"]').val(data.jurupengairan);
                    $('[name="field4"]').val(data.namrumahjaga);
                    $('[name="field5"]').val(data.petugas);
                    $('[name="field6"]').val(data.kecamatan);
                    $('[name="field7"]').val(data.desa);
                    $('[name="field9"]').val(data.dusun);
                    $('[name="field10"]').val(data.tahunpembuatan);
                    $('#modal_form').modal('show');
                },
                error: function (jqXHR, textStatus, errorThrown)
                {
                    alert('Error get data from ajax');
                }
            });
        }
    </script>

这是我的控制器

function rj_page(){
        // Datatables Variables
        $draw = intval($this->input->get("draw"));
        $start = intval($this->input->get("start"));
        $length = intval($this->input->get("length"));
        $rumahjaga = $this->m_data->get_db_rj();
        $no = $this->input->get('start');
        $data = array();
        foreach($rumahjaga->result() as $r){
            $no++;
            $row = array();
            $row[] = $no;
            $row[] = $r->namaDI;
            $row[] = $r->namarumahjaga;
            $row[] = '<a class="btn btn-sm btn-primary" href="javascript:void(0)" title="Edit" onclick="view_detail('."'".$r->idrumahjaga."'".')"><i class="glyphicon glyphicon-pencil"></i> Edit</a>';
            $data[] = $row;
        }
        $output = array(
            "draw" => $draw,
            "recordsTotal" => $rumahjaga->num_rows(),
            "recordsFiltered" => $rumahjaga->num_rows(),
            "data" => $data
        );
        echo json_encode($output);
        exit();
    }
    public function ajax_view($id)
    {
        $data = $this->m_data->get_by_id_rj($id);
        echo json_encode($data);
    }

我的模特

function get_db_rj(){
    $this->db->select('*');
    $this->db->from('rumahjaga');
    $this->db->join('daerahirigasi', 'daerahirigasi.kodeDI = rumahjaga.kodeDI');
    $query = $this->db->get();
    return $query;
}
public function get_by_id_rj($id)
{
    $this->db->select('*');
    $this->db->from('rumahjaga');
    $this->db->join('daerahirigasi', 'daerahirigasi.kodeDI = rumahjaga.kodeDI');
    $this->db->where('idrumahjaga',$id);
    $query = $this->db->get();
    return $query->row();
}

我非常感谢愿意花时间解决这个问题的人

Answer 1

我得到了解决方案：

$('[name="field1"]').val(data.id_rumahjaga);

和

<td name="field1"></td>

更改为

$('#field1').html(data.id_rumahjaga);

<td id="field1"></td>

感谢post

在codeigniter中使用Ajax显示模式引导中数据库中的行数据

1 个答案: