Access to JSON element with Javascript

Question

I have this simple JSON object:

 [{"k":51.39920565355378,"B":0.087890625}]

I want to access to k and B with Javascript, here is my code:

 var jsonData = JSON.parse(jsonText);
 console.log(jsonData.k); //Undefined

It always return me undefined, what ever I try but when I display jsonData, I can see the all description of the JSON object:

 console.log(jsonData) //[{"k":51.39920565355378,"B":0.087890625}]

Here is the server code witch retrieve my JSON object:

 function getMarkersByTripId($tripId)
 {
    if ($bdd = mysqli_connect(_BDD_HOST_, _BDD_USERNAME_, _BDD_PASSWORD_, _BDD_NAME_)) {

    $sql = 'SELECT DISTINCT `markers` FROM `trip` WHERE `trip_id` = "'.$tripId.'"';
    $req = mysqli_query($bdd, $sql);

    if ($req) {
        $row = mysqli_fetch_row($req);
        echo json_encode($row[0]);
    }
    else {
        echo json_encode(array('status' => 'failure'));
    }
  }

    if ($bdd) {
    mysqli_close($bdd);
  }
}

Function witch add my JSON object into the database:

 function actionSaveNewtrip($title, $status, $markers)
 {
    if ($bdd = mysqli_connect(_BDD_HOST_, _BDD_USERNAME_, _BDD_PASSWORD_, _BDD_NAME_)) {
        $markers = mysqli_real_escape_string($bdd, $markers);
        $sql = 'INSERT INTO `trip` (title, status, markers) VALUES("'.$title.'",  "'.$status.'", "'.$markers.'")';
        $req = mysqli_query($bdd, $sql);

      if ($req) {
        echo json_encode(array('status' => 'success'));
      }
       else {
          echo json_encode(array('status' => 'failure'));
      }
  }

  if ($bdd) {
    mysqli_close($bdd);
 }
}

$markers is the JSON object that I insert into the database.

I would like to know what I'm doing wrong to access to k and B like an array, thank you.

Try this in your browser console: `JSON.parse('[{"k":51.39920565355378,"B":0.087890625}]')[0].k` - it definitely works. — Pointy, Dec 09 '14 at 23:36

score 2 · Answer 1 · answered Dec 09 '14 at 23:30

2

Your JSON will parse into an array with one object in it. Try

console.log(jsonData[0].k);

The outer [ ] make it an array.

answered Dec 09 '14 at 23:30

Pointy

405,095
59
585
614

Still undefined, I tried it. – Nizar B. Dec 09 '14 at 23:35
Try this in your browser console: `JSON.parse('[{"k":51.39920565355378,"B":0.087890625}]')[0].k` - it definitely works. – Pointy Dec 09 '14 at 23:35
Yes it works if I hard-code the JSON description, but not with the JSON object that I fetch from a MySQL database. When I do console.log(jsonData), I have: ["[{"k":47.635783590864854,"B":2.8125}]"] Maybe my JSON is malformed but I don't see yet how to fix it? – Nizar B. Dec 09 '14 at 23:40
Still stuck with this bug. – Nizar B. Dec 10 '14 at 09:49

Peter Olson · Answer 2 · 2014-12-09T23:37:18.660

2

Since it is wrapped in an array, you need to access the first array alement

jsonData[0].k

You can see that it works in the following code snippet:

var jsonData = JSON.parse('[{"k":51.39920565355378,"B":0.087890625}]');
alert(jsonData[0].k)

edited Dec 09 '14 at 23:37

answered Dec 09 '14 at 23:31

Peter Olson

139,199
49
202
242

@Katcha I can't reproduce your problem. I've inserted a code snippet into the answer and it works just fine. – Peter Olson Dec 09 '14 at 23:37
Doesn't work when jsonData = ["[{"k":47.635783590864854,"B":2.8125}]"] – Nizar B. Dec 09 '14 at 23:54
@Katcha that's a totally different thing than what you posted. You can't expect people to provide accurate help if you don't accurately describe your problem! – Pointy Dec 10 '14 at 00:00
@Pointy Agree with you, sorry about that. – Nizar B. Dec 10 '14 at 00:01
@Katcha well whatever. It can be confusing dealing with JSON responses, because the way that the browser `console.log()` code prints objects can be "dishonest". What you put in your comment makes it seem that your server is returning a JSON-encoded array that contains a single JSON-encoded string; that is, that there's a double-encoding going on for some reason. If you have access to the server code that creates the response and can post it, that might help determine what's going on. – Pointy Dec 10 '14 at 00:07
@Pointy Just added the PHP code witch get the JSON object. – Nizar B. Dec 10 '14 at 00:11
$row[0] contains my JSON description witch return to my AJAX call. – Nizar B. Dec 10 '14 at 00:12
@Katcha Hmm; the php code looks OK, unless the data in the row itself is (for some weird reason) already a JSON-encoded string. – Pointy Dec 10 '14 at 00:17
@Pointy I'm going to post the PHP code witch add the JSON object into the MySQL database, you might be right! – Nizar B. Dec 10 '14 at 00:19

Access to JSON element with Javascript

2 Answers2