Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I have the following code which is generated in PHP:

<div id='container1' data-history="[["test", "test title", "", []]]">

I wish to have this accessible in javascript but when I use console.log(history[0]) it outputs '[' so its treating the array as a string.

Is there a way to have it so that javascript can read it as an array?

My PHP code is as follows (i removed the slashes and '' around the array)

echo '<div id="container1" data-history=[[0]["test", "test title", "", []]] data-current-url="'.$url.'">';
share|improve this question
    
how are you doing echo for data-history attribute value from php? –  Ravi Dhoriya ツ Apr 18 '14 at 7:29
    
Yes I am using echo from PHP –  Nuvolari Apr 18 '14 at 7:30
    
echo is fine, but how are you doing that for array? plz provide php code –  Ravi Dhoriya ツ Apr 18 '14 at 7:31
    
check dis, for that you need to make your array valid json, stackoverflow.com/questions/13272406/… –  Ravi Dhoriya ツ Apr 18 '14 at 7:33
    
I updated the array bit but now it gives me: SyntaxError: JSON.parse: unexpected keyword –  Nuvolari Apr 18 '14 at 7:52

4 Answers 4

up vote 1 down vote accepted

If you removed the \ characters from it and added a , after the first array element, then it would be valid JSON and you could pass it through JSON.parse().

  <div id='container1' data-history='[[0],["test", "test title", "", []]]'></div>
  <script>
    var history = JSON.parse(document.getElementById('container1').getAttribute('data-history'));
    console.log(history);
    alert(history[1][1]);
  </script>

From a comment on another answer:

Its meant to be a multi dimensional array where index 0 contains '["test", "test title", "", []]'

You don't specify the property names in JavaScript or JSON array literal syntax. The position determines the property name.

data-history='[["test", "test title", "", []]]'>
share|improve this answer
    
Ok I did that and it gives me this error: "SyntaxError: JSON.parse: unexpected end of data". My new code: data-history=[[0]["test", "test title", "", []]] –  Nuvolari Apr 18 '14 at 7:31
    
You've removed the ' characters from around the attribute value. Don't do that. Attribute values containing spaces must be quoted. –  Quentin Apr 18 '14 at 7:32
    
hmm, you are also missing a comma after the first array element –  Quentin Apr 18 '14 at 7:36

Besides the escape characters (that are to be removed), the following string is not regular JSON:

[[0]["test", "test title", "", []]]

So eventually it won't be parsed by JSON.parse(). Maybe you ment following form:

[[0, "test", "test title", "", []]]

That is correctly parsed by JSON.parse():

var dataHistory = JSON.parse('[[0, "test", "test title", "", []]]');

EDIT

As for the multidimensional array, there are several possibilities:

  1. use the natural position of the elements:

    var dataHistory = [
      ["test", "test title", "", []]    //this is the 0 element
    ];
    var myZeroElement = dataHistory[0];
    
  2. use a key, value structure:

    var dataHistory = [
      {'key':'0', 'value': ["test", "test title", "", []]}
    ];
    var myZeroElement = dataHistory[0].value;
    
share|improve this answer
    
Its meant to be a multi dimensional array where index 0 contains '["test", "test title", "", []]' –  Nuvolari Apr 18 '14 at 7:36
    
I've changed it to your first suggestion but it gives me this error:SyntaxError: JSON.parse: unexpected keyword –  Nuvolari Apr 18 '14 at 7:51
    
Please post the code you use to grab the data-history attribute value and to parse it. –  Alberto De Caro Apr 18 '14 at 8:07

Since both javascript and php have the same two types of quotes to delimitate strings, you need to escape some of them:

echo '<div id="container1" data-history=\'[[0],["test", "test title", "", []]]\' data-current-url="'.$url.'">';
share|improve this answer
    
I had at the start but apparently that wasn't valid according to answers. –  Nuvolari Apr 18 '14 at 8:03
    
What is not valid? –  Maurice Perry Apr 18 '14 at 8:05
    
Oh yes, there is a missing comma –  Maurice Perry Apr 18 '14 at 8:07
    
Added the comma. now it's correct –  Maurice Perry Apr 18 '14 at 8:09

This data is not valid JSON string. You can check it here: http://jsonlint.com/

In PHP use json_encore($table); to encode your array to a valid JSON string and put it in your HTML attribute.

Then use JSON.parse(history) in your JS to get the corresponding JSON object.

EDIT: Change yout php to this:

echo '<div id="container1" data-history="[\"test\", \"test title\", \"\"]" data-current-url="'.$url.'">';

And use the JS code I supplied.

share|improve this answer
    
Can the downvote be explained ? –  ZarkDev Apr 18 '14 at 9:02

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.