CODEWITHSUNDEEP
phpjqueryjson
Curtis Upshall
Curtis Upshall

Reputation: 91

Parsing JSON array of arrays in jQuery

I'm currently using jQuery's $.get() to process IDs entered in a text field with a database. It currently works quite well, especially the PHP which can handle multiple comma-separated entries.

The issue I'm having is with jQuery; more specifically, JSON parsing. The PHP file returns an array of arrays, which is used to manipulate a <table>. While it works with single entries, i.e. "12346", it doesn't work with multiple entries, such as "123456,789101".

The error is specifically thrown at Line 77: var serverData = $.parseJSON(data)[0];

Here's the stack trace

Uncaught SyntaxError: Unexpected token s in JSON at position 2
    at Function.parse [as parseJSON] (<anonymous>)
    at Object.<anonymous> (myScript.js:77)
    at u (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at k (jquery.min.js:2)
    at XMLHttpRequest.<anonymous> (jquery.min.js:2)

Here is what my code looks like so far:

PHP:

$sql = "SELECT * FROM students";
$stmt = $pdo->prepare($sql);
$stmt->execute();
//Database access is arbitrary
while ($row = $stmt->fetch()) { //iterate through db results
  $student_array[$row['sid']] = array(
    'name' => $row['name'],
    'advisory' => $row['advisory']
  );
}

$json_params[] = array(
  "students" => $student_array, /* The array of arrays */
  "success" => "n students were checked in, nice!" /* generic message */
  "failure" => "m students couldn't be accessed"
);

echo json_encode($json_params);

jQuery:

$.get("check-in.php", {value: inputValue}).done(function(data) {
  var serverData = $.parseJSON(data)[0];
  if (serverData.success) {
    $.each(serverData.students, function(sid, tableValues) {
      /* Create a <tr> based on the information (using the key as the SID,
       * name, and advisory, and insert that <tr> into a table */
    });
  }
}

This might be the culprit, which is the JSON text causing the issue:

[{
  "students": {
    "245680":{"name":"John Doe","advisory":"9"},
    "135791":{"name":"Jane Smith","advisory":"7"}
  },
  "success":"2 students were checked in!"
}]

I'm quite puzzled as it's been working fine with single number entries. I've looked at solutions to "parsing JSON arrays of arrays" on this site, but I've tried all the suggestions for those. Any help is greatly appreciated!

Upvotes: 0

Views: 268

Answers (2)

jdigital
jdigital

Reputation: 12266

Your code has this:

var serverData = $.parseJSON(data)[0];

but it's failing because data is already an object (not a json string that needs to be parsed).
Try this:

var serverData = data[0];

Upvotes: 1

david
david

Reputation: 3218

I don't see the need to make $json_params as an array. It is stored outside of looping and executed only once. Just remove [] part. THe code will look like this.

$json_params = array(
    "students" => $student_array, /* The array of arrays */
    "success" => "n students were checked in, nice!" /* generic message */
    "failure" => "m students couldn't be accessed"
);

In your jQuery, you can simply retrieve JSON result without having to access key array. [0] isn't necessary as [] in $json_params is removed.

var serverData = $.parseJSON(data);

Upvotes: 2

Related Questions