jeffr
jeffr

Reputation: 35

I can't parse using JSON using Javascript

I have read the post for this an yet I still don't know what is happening.

My var "text" is valid according to most JSON online data checker but when I execute the parse it doesn't do anything.

Here is an example code:

<!DOCTYPE html>
<html>
<body>

<h2>Create Object from JSON String</h2>

<p id="demo"></p>

<script>
var text = '{
"zipcodes": [
    {
        "zip": "22312",
        "city": "Alexandria",
        "state": "VA"
    },
    {
        "zip": "22030",
        "city": "Fairfax",
        "state": "VA"
    },
    {
        "zip": "22301",
        "city": "Tyson's Corner",
        "state": "VA"
    },
    {
        "zip": "20148",
        "city": "Ashburn",
        "state": "VA"
    }
]}';

obj = JSON.parse(text);
document.getElementById("demo").innerHTML =
obj.zipcodes[1].zip + " " + obj.zipcodes[1].city;
</script>

</body>
</html>

Upvotes: 1

Views: 58

Answers (3)

Farhan Rahman
Farhan Rahman

Reputation: 206

You need to add \ at the end of every string new line and escape the ' character. Something like this will do:

var text = '{\
"zipcodes": [\
    {\
        "zip": "22312",\
        "city": "Alexandria",\
        "state": "VA"\
    },\
    {\
        "zip": "22030",\
        "city": "Fairfax",\
        "state": "VA"\
    },\
    {\
        "zip": "22301",\
        "city": "Tyson\'s Corner",\
        "state": "VA"\
    },\
    {\
        "zip": "20148",\
        "city": "Ashburn",\
        "state": "VA"\
    }\
]}';

obj = JSON.parse(text);

console.log(obj.zipcodes[1].zip + " " + obj.zipcodes[1].city);
document.getElementById("demo").innerHTML =
obj.zipcodes[1].zip + " " + obj.zipcodes[1].city;

Here is a jsfiddle link:

http://jsfiddle.net/0retway7/

Upvotes: 0

Justin Niessner
Justin Niessner

Reputation: 245429

You have two issues:

  1. JavaScript doesn't support multi-line strings without marking each line with a continuation (via \ at the end of the line). I've done this in my example but it's really easier to include your JSON on a single line.

  2. You're using single-quotes for your string but your string contains an un-escaped '. Escape it, and you're fine.

var text = '{ \
  "zipcodes": [\
    { \
      "zip": "22312", \
      "city": "Alexandria", \
      "state": "VA" \
    }, \
    { \
      "zip": "22030", \
      "city": "Fairfax", \
      "state": "VA" \
    }, \
    { \
      "zip": "22301", \
      "city": "Tyson\'s Corner", \
      "state": "VA" \
    }, \
    { \
      "zip": "20148", \
      "city": "Ashburn", \
      "state": "VA" \
    } \
  ]}';

obj = JSON.parse(text);
document.getElementById("demo").innerHTML =
obj.zipcodes[1].zip + " " + obj.zipcodes[1].city;
<div id='demo'></div>

Upvotes: 3

whoacowboy
whoacowboy

Reputation: 7447

You have to put the json on one line and escape your '.

"Tyson\'s Corner"

http://jsbin.com/xumiba/1/edit?html,js,console,output

var text = '{ "zipcodes": [ { "zip": "22312", "city": "Alexandria", "state": "VA" }, { "zip": "22030", "city": "Fairfax", "state": "VA" }, { "zip": "22301", "city": "Tyson\'s Corner", "state": "VA" }, { "zip": "20148", "city":"Ashburn", "state": "VA" }]}';

Upvotes: 2

Related Questions