Jquery DataTable with Ignited-Datatables CodeIgniter

问题

Update:

I finally found the solution for this problem. If you face the same problem as mine, you can try visit this link

I am having problem when want to integrate Jquery DataTables with CodeIgniter Ignited-Datatables library

When I use the default DataTables sServerMethod property which is "GET", I got the json response with data from my php. However since CodeIgniter use post, I stuck at loading server data although the function return me correct json output.

So I follow this guide to change the sServerMethod to "POST". Now I dont stuck at loading server data, but I dont get the data that I need.

JSON response using sServerMethod GET (get correct json, but stuck at loading server data as in the image)

{
"sEcho": 0,
"iTotalRecords": 10,
"iTotalDisplayRecords": 10,
"aaData": [
    [
        "Munauwar",
        "Syed",
        "Mr",
        "6012345678",
        "0000-00-00",
        "basikal"
    ],        
    [
        "Mak",
        "Je Wei",
        "Mr",
        "6012345678",
        "0000-00-00",
        "motor"
    ]
],
"sColumns": "first_name,last_name,salutation,number,birthday,group_name"}

JSON response using sServerMethod POST

{
"sEcho": 1,
"iTotalRecords": 10,
"iTotalDisplayRecords": 0,
"aaData": [],
"sColumns": "first_name,last_name,salutation,number,birthday,group_name"}

This is my javascript code

$('#table1').dataTable({
        "bProcessing": true,
        "bServerSide": true,            
        "sPaginationType": "bootstrap",
        "sAjaxSource": config.base_url + "contact/popup_contact",
        "sServerMethod": "POST"

    });

My function in contact controller

function popup_contact()
{
    $this->datatables
         ->select('first_name,last_name,salutation,number,birthday,group_name')
         ->from('tb_contact')
         ->join('tb_contact_group', 'tb_contact.contact_group_id = tb_contact_group.contact_group_id');          

    echo $this->datatables->generate();             

}

回答1:

If the method above still doesn't work, then its because you have set: $config['csrf_protection'] = true; // in your config of Codeigniter

Simply add the aoData.push line first thing in your fnServerData call:

"fnServerData": function(sSource, aoData, fnCallback) {
            aoData.push({name: '<?php echo $this->security->get_csrf_token_name(); ?>', value: '<?php echo $this->security->get_csrf_hash(); ?>'});
                $.ajax({
                    'dataType': 'json',
                    'type': 'POST',
                    'url': sSource,
                    'data': aoData,
                    'success': fnCallback
                });
            }

回答2:

$('#smstable').dataTable({
"bProcessing": true,
"bServerSide": true,
"iDisplayLength": 20,
//"bPaginate": true,
"bAutoWidth": false,
"iDisplayStart": 0,
"bLengthChange": false,//for sorting 10,20,30,50 ....
"sAjaxSource": "././myadmin/ajaxadmin/dt_sms",
"aaSorting": [[ 1, "desc" ]],
"sPaginationType": "full_numbers",
"aoColumns":[
    {"bSearchable": false,"bSortable": false,"bVisible": false},
    {"bSearchable": true,"bSortable": true},
    {"bSearchable": false,"bSortable": false},
    {"bSearchable": true,"bSortable": true},
    {"bSearchable": false,"bSortable": true},
    {"bSearchable": false,"bSortable": false}
],
"fnServerData": function(sSource, aoData, fnCallback){
    $.ajax(
          {
            'dataType': 'json',
            'type'  : 'POST',
            'url'    : sSource,
            'data'  : aoData,
            'success' : fnCallback
          }
      );//end ajx
    // console.log(fnCallback);
}

});//end datable

Just check my code and check if you missed something. That code works very fine with me.

回答3:

Anytime you got stuck on loading data from server.....it's basically cause by column set. Just count the "aoColumns" array and make sure is exactly equal to the table head set in your view file.

It's has happened to me time and again.....and the only solution has always been the column array set.

来源：https://stackoverflow.com/questions/11355542/jquery-datatable-with-ignited-datatables-codeigniter

标签

codeigniter

datatables