jquery dataTables不显示数据显示ajax错误

时间:2017-09-20 20:33:04

标签: jquery ajax codeigniter datatables

我想使用带有ajax的jquery数据表来显示mysql表数据。但它显示错误信息。 show this image

我的代码有问题吗? 这是我的控制器。

public function fetch_data()
{
    $this->load->model('base_model');
    $fetch_data=$this->base_model->make_datatables();
    $data=array();
    foreach($fetch_data as $row)
    {
        $sub_array=array();
        $sub_array[]=$row->id;
        $sub_array[]=$row->firstName;
        $sub_array[]=$row->lastName;
        $sub_array[]=$row->gender;
        $sub_array[]=$row->address;
        $sub_array[]=$row->dob;
        $sub_array='<button type="button" name="update" id="'.$row->id.'" class="btn btn-warning">Update</button>';
        $sub_array='<button type="button" name="delete" id="'.$row->id.'" class="btn btn-danger">Delete</button>';
        $data[]=$sub_array;
    }

    $output=array(
        'draw'=>intval($_POST["draw"]),
        'recordsTotal'=>$this->base_model->get_all_data(),
        "recordsFiltered"     =>     $this->crud_model->get_filtered_data(),  
        "data"                    =>     $data  
    );
    echo json_encode($output);  

}

这是我的观看代码

 $(document).ready(function(){
    var dataTable=$('#user_data').dataTable({
        "processing":true,
        "serverSide":true,
        "order":[],
        "ajax":{
            url:"<?php echo base_url().'base/fetch_data'?>",
            type:"POST",
            dataType:"json"

        },
        "columnDefs":[
            {
            "target":[0,3,4],
            "orderable":false
            }
        ]
    });
});

2 个答案:

答案 0 :(得分:0)

与jquerydatabale&amp; AJAX

Contorller:

public function ajax_get_records() //jquerydatatable for static columns and rows
    {
        $arrayCount = 3; 
        $json = [
                    [
                      "Tiger Nixon",
                      "System Architect",
                      "Edinburgh",
                      "5421",
                      "2011/04/25",
                      "$320,800"
                    ],
                    [
                      "Garrett Winters",
                      "Accountant",
                      "Tokyo",
                      "8422",
                      "2011/07/25",
                      "$170,750"
                    ],
                ];
                $columns = [
                      "Name",
                      "Position",
                      "Office",
                      "Extn",
                      "Start date",
                      "Salary"
                ];
            $ajax_data['total'] = intval(3);
            $ajax_data['recordsFiltered'] = intval(3);
            $ajax_data['columns'] = $columns;
            $ajax_data['data'] = $json;
            header('Content-Type: application/json');
            echo json_encode($ajax_data);
    }

视图:

<html>
<title>Details</title>
<head></head>
<body>
<br>
<table id="example" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <td colspan="11" align="center">
                <div style="float:left">
                    <a title="uploads" href="<?php echo base_url();?>xlsimport/uploads">
                    <img src="<?php echo base_url();?>images/insert.png" height="25px" width="30px"></a>
                </div>
                </td>
            </tr>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Extn.</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>       
    </table>
</body>
</html>
<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>datatable/jquery.dataTables.min.css">
<script src="<?php echo base_url();?>datatable/jquery-1.12.4.js"></script>
<script src="<?php echo base_url();?>datatable/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {
    $('#example').DataTable( {
        "ajax": "<?php echo base_url() ?>xlsimport/ajax_get_records"
    } );
} );
</script>

答案 1 :(得分:0)

请针对您的问题尝试此解决方案:

Calendar dateTime=Calendar.getInstance();
long milliseconds=dateTime.getTimeInMillis();
  

数据表脚本:

<html>
<title>Details</title>
<head>
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/jquery.dataTables.min.js"></script>
<script type="text/javascript">
    base_url = '<?=base_url()?>';
</script>
</head>
<body>
    <table id="user_data" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <td colspan="6" align="center">
                    <div style="float:left">
                        <a title="uploads" href="<?php echo base_url();?>xlsimport/uploads">
                        <img src="<?php echo base_url();?>images/insert.png" height="25px" width="30px"></a>
                    </div>
                </td>
            </tr>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Extn.</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>       
        <tbody></tbody>
    </table>
</body>
</html>

注意:请访问此JSfiddle以获取参考http://jsfiddle.net/bababalcksheep/ntcwust8/