DataTables with JSON, AJAX and PHP not displaying any data

Question

I've been trying to get DataTables to work with my existing Ajax search function - which works by itself.

I have the following code:

        $('#SearchResults').dataTable({
            "bProcessing": true,
            "bServerSide": true,
            "bRetrieve": true,
            "sAjaxSource": "process.php?action=searchArtifact",
            "fnServerData": function (sSource, aoData, fnCallback){
                aoData.push({
                    "name": "searchName",
                    "value": $('#ArtifactSearch').attr('value')
                });
                $.ajax({
                    "dataType": "json", 
                    "type": "POST", 
                    "url": sSource, 
                    "data": aoData, 
                    "success": fnCallback
                });

            }
        });

The PHP is returning a valid JSON object (using JSON_FORCE_OBJECT):

{"0":{"ARTIFACT_ID":"4E2FE3BCE356C","ARTIFACT_NAME":"123","ARTIFACT_TYPE":"UI","ARTIFACT_LABEL":"Test_Int_EAS_123","ARTIFACT_LOCATION":"Int","ARTIFACT_DOMAIN":"ABC","ARTIFACT_AUTHOR":null,"REGISTERED_EMAIL":"[email protected]","REGISTERED_DATE":"27-07-2011","REGISTERED_TIME":"11:09:00"}

I can see this all fine in FireBug, but my empty table is not being populated with this data.

Any ideas?

@Kyle: Errr - thats it. I guess I don't have one? This is my first attempt (struggle) with DataTables and I'm just copying from the documentation: http://www.datatables.net/usage/callbacks#fnServerData

@MarcB: Added that - but still no data displayed. Thanks for the help

success: function(data) { fnCallback(data); } to explictly pass over the returned data? — Marc B
– Marc B, Commented Aug 11, 2011 at 18:16
can you show us the PHP source code that return the result? Because I think it didn't give the proper format requested here datatables.net/usage/server-side — Captain kurO
– Captain kurO, Commented Jun 23, 2012 at 20:56
I made a simple tutorial that explains well how to solve your issue, check [this link ](refreshmymind.com/datatables-dom-php-ajax-mysql-datasources) — Charaf JRA
– Charaf JRA, Commented Dec 3, 2015 at 10:30

BDS1400 · Accepted Answer · 2011-12-18 21:51:57Z

1

I was having a similar problem. Turns out I wasn't forming the JSON response properly. This worked for me:

<?php

$arr = array ('aaData' => array(
array('3','35','4', '$14,500', '$15,200','$16,900','5','1'),
array('1','16','4', '$14,200', '$15,100','$14,900','Running','1'),
array('5','25','4', '$14,500', '$15,600','$16,900','Not Running','1')
)
);

echo json_encode($arr);
?>

answered Dec 18, 2011 at 21:51

BDS1400

1371 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Parham Doustdar · Accepted Answer · 2011-11-08 13:55:12Z

0

This plugin expects the returned JSON object to be an object, with a property which is an array of arrays. This property should be called 'aaData'. You are not returning an object; you are just returning the array.

answered Nov 8, 2011 at 13:55

Parham Doustdar

2,0494 gold badges24 silver badges43 bronze badges

Comments

Randell · Accepted Answer · 2012-01-30 02:23:25Z

0

Check out this json resource example from DataTables.net: http://datatables.net/examples/examples_support/json_source.txt. Notice that you are returning json with brackets as compared to the example's braces.

answered Jan 30, 2012 at 2:23

Randell

6,1716 gold badges47 silver badges71 bronze badges

Comments

Aldee · Accepted Answer · 2012-06-01 15:53:49Z

0

you can remove the $.ajax part, instead you can use the $.getJSON method.

answered Jun 1, 2012 at 15:53

Aldee

4,58810 gold badges52 silver badges73 bronze badges

Comments

Phoenix · Accepted Answer · 2013-09-25 12:10:37Z

0

You can also add the following to avoid adding an extra object like "aaData":

"sAjaxDataProp": ''

answered Sep 25, 2013 at 12:10

Phoenix

413 bronze badges

Comments

Scott Arciszewski · Accepted Answer · 2014-02-20 20:26:51Z

0

What are you setting sEcho to?

Your JSON should have this structure:

{
  "sEcho": 'refer to "sEcho" in $_GET or $_POST; don't forget to sanitize', 
  "iTotalRecords": 'for pagination',
  "iTotalDisplayRecords": 'number displayed',
  "aaData" => { /* your data here */ }
}

answered Feb 20, 2014 at 20:26

Scott Arciszewski

34.3k17 gold badges94 silver badges212 bronze badges

Comments

Henz · Accepted Answer · 2017-01-05 07:30:36Z

0

This is a few years late but might help someone. :)

DataTable cannot render null values. See defaultContent to set content when data return is null.

See link: https://datatables.net/reference/option/columns.defaultContent

For legacy dataTables, see http://legacy.datatables.net/ref and search for sDefaultContent

answered Jan 5, 2017 at 7:30

Henz

1215 bronze badges

Collectives™ on Stack Overflow

DataTables with JSON, AJAX and PHP not displaying any data

7 Answers 7

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related