jquery Datatables using JSON

debugcn Published at Dev

swifty

I am using datatables jQuery plugin to show the data nicely withing a table. I am making an ajax request on a click of a button which is then running a php script returning a JSON.

Here's how my code:

 $('#searchInSugar').button().on('click', function (e) {
                    var searchTxt = $('#searchEntry').val();
                    var moduleName = $('#moduleSelect').val();

                    if (!searchTxt.trim() || searchTxt.length === 0) {
                        alert("Please provide some search text string..");
                        return false;
                    }
                    if (moduleName === "select") {
                        alert("Please select a module..");
                        return false;
                    }
                    $.ajax({
                        type: 'POST',
                        url: "fetch_records.php",
                        data: {"searchText": searchTxt,
                            "module": moduleName},
                        success: function (data) {                            
                            obj = JSON.parse(data);

                            $(document).ready(function () {
                                $('#dialog_entry_table').DataTable({
                                    "info": false,
                                    data: data,
                                 columns: [
                                        {"records": "id"},
                                        {"records": "name"},
                                        {"records": "account_name"}
                                    ]
                                });
                            });
                        },
                        error: function (exception) {
                            alert('Exeption:' + exception);
                        }
                    });
                });

Here's the json that I get from the php script.

 {  
   "next_offset":-1,
   "records":[  
      {  
         "id":"a54e81f8-72b2-ae9b-d526-5608761a28e8",
         "name":"Mr. James Smith",
         "date_modified":"2015-09-27T23:52:29+00:00",
         "account_name":"",
         "_acl":{  
            "fields":{  

            }
         },
         "_module":"Contacts"
      },
      {  
         "id":"b8ec2e0a-ade1-f70f-d722-56098e5c4370",
         "name":"james bond",
         "date_modified":"2015-09-28T22:50:56+00:00",
         "account_name":"",
         "_acl":{  
            "fields":{  

            }
         },
         "_module":"Contacts"
      },
      {  
         "id":"4de93888-155c-7e59-9c4b-56058f1b7ce9",
         "name":"Mr. James Bond",
         "date_modified":"2015-09-28T01:50:49+00:00",
         "account_name":"OSSG",
         "_acl":{  
            "fields":{  

            }
         },
         "_module":"Contacts"
      }
   ]
}

Now, I ONLY WANT TO SHOW id, name and account_name IN THE TABLE, But I am having a hard time achieving this, could someone help/advise what I am doing wrong here.

This is the error I am getting:

madalinivascu

Try:

    var dt = [];
    $.each(data.records,function(i,v) {
    dt.push([v.id,v.name,v.account_name]);
    });
   $('#dialog_entry_table').DataTable({
            "info": false,
             data: dt,
             columns: [
                {"title": "id"},
                {"title": "name"},
                {"title": "account_name"}
            ]
      });

jsfiddle: https://jsfiddle.net/bwqfq2gr/1/

Collected from the Internet

Please contact [email protected] to delete if infringement.