Trouble processing JSON data returned from AJAX call

Trouble processing JSON data returned from AJAX call

ApothusApothus Posts: 4Questions: 1Answers: 0

I have a table on my page that is to be populated with information on a particular employee. When the user clicks on a radio button on an existing table on my page (built with php) it parses the key through the the ajax call and returns the data in a JSON object for display on the page.

$('#employeeTable input[type=radio]').click(function() {
var employeeKey = $(this).val();
var request = $.ajax({
url : "/PHP/employeeData.php",
type : 'post',
data : {'key':employeeKey}
}).done(function(returnedData){
console.log(returnedData);
$("#employeeInformation").show(100);
$("#employeeInformation").DataTable({
data: returnedData,
columns: [
{data :'first name'},
{data :'surname'},
{data :'display name'},
{data :'drivers license'},
{data :'Contact Number'},
{data :'Job Description'}
]
});
});
});

However whenever i generate the table i receive the alert message:

DataTables warning: table id= employeeInformation - requested unknown parameter 'first name' for row 0.

The information logged to the console appears like this:

[{"key":"10","id":"1","first name":"Jackson","surname":"Harkness","display name":"Jack Harkness","gps req":"0","lockout enab":"0","lockedout":"0","siteAdmin":"1","adminOnly":"0","drivers license":"99999999","Contact Number":"6666666666","Job Description":"Head of torchwood","template1":"","template2":"","template3":"","template4":"","template5":"","template6":"","template7":"","template8":"","template9":"","template10":"","Last Modified":"2014-05-24 08:51:28"}]

However for whatever reason the information cannot be extracted.
If however in place of 'returnedData' i paste the array above it has no problem populating the data.

Please help, this is driving me insane because I cannot see why it wouldn't work!?

This question has an accepted answers - jump to answer

Answers

  • ApothusApothus Posts: 4Questions: 1Answers: 0

    jsfiddle for readability http://jsfiddle.net/8efQu/

  • ApothusApothus Posts: 4Questions: 1Answers: 0

    Worked it out:
    In the AJAX call the datatype must be explicitly declared as JSON.

    $.ajax({
    url : "/PHP/employeeData.php",
    type : 'post',
    data : {'key':employeeKey} ,
    dataType : "JSON" //additional line
    }).

  • RpiechuraRpiechura Posts: 98Questions: 3Answers: 14
    Answer ✓

    Mark your reply as an answer than so people don't think you still need help =). Glad you figured it out though.

  • ApothusApothus Posts: 4Questions: 1Answers: 0

    It would appear i cannot answer my own question, so I'll just set that you did Rpiechura

  • allanallan Posts: 63,687Questions: 1Answers: 10,500 Site admin

    That's a flaw in the forum isn't it... I'll look into that. Thanks for letting me know :-)

    Allan

This discussion has been closed.