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 the following PHP code:

echo "<img src='../images/edit.png' onclick='showEditDiv(" . json_encode($row) . ");'>";

Here is the HTML result:

<img src='../images/edit.png' onclick='showEditDiv({"ID":"2","NAME":"John Smith","EMAIL":"[email protected]"});'>

And here is the Javascript code:

function showEditDiv(data) {
  alert(data);
  data = JSON.parse(data);
  alert(data);
  for (i=0; i< data.length; i++){ 
    alert(data[i]);
  };
}

The problem is I'm not getting the desired array in the JS parameter. The first alert shows "[object Object]" and that's all, no more alerts. Where is the problem? My code is based on the examples I found here. All I want is to pass an array to JS function, which is in a separated .js file. I don't want to use JQuery, prefer native JS.

share|improve this question
2  
What you have is not an array. It is an object literal. What exactly do you want –  PSL Dec 26 at 1:45
 
@PSL: I believe OP is using "array" in PHP sense (hash-array-bag-thingy). –  Amadan Dec 26 at 1:47
add comment

4 Answers

up vote 2 down vote accepted

You aren't passing JSON to the function (JSON would be a string, hence ending/beginning with quotes). What you're passing is a JavaScript object literal. See the difference:

Object literal

{"ID":"2","NAME":"John Smith","EMAIL":"[email protected]"}

JSON string

"{\"ID\":\"2\",\"NAME\":\"John Smith\",\"EMAIL\":\"[email protected]\"}\"
// or, easier than escaping all those quotes..
'{"ID":"2","NAME":"John Smith","EMAIL":"[email protected]"}'

Of course, for your purposes, the object literal may be easier to work with. In that case you just need to remove the JSON.parse from your JavaScript code:

function showEditDiv(data) {
    // The below won't work unless you change your input data to a
    // JS array literal..
    /* for (i=0; i< data.length; i++){ 
        alert(data[i]);
    }; */

    // ..but you can do this (though it's risky to iterate through keys
    // on an object without at least using HasOwnProperty)
    for (var key in data) {
        alert(data[key]);
    }
}
share|improve this answer
 
could you correct my code to make it clear for me, please? –  tcxbalage Dec 26 at 1:45
 
@tcxbalage See my latest edit. –  Chris Hayes Dec 26 at 1:47
 
What is a JSON string? You mean an escaped string here. Or do you call &lt;span&gt; an html string? –  Neikos Dec 26 at 1:48
 
@Neikos: JSON is always a string. JS object is almost the same thing, but as a structure in JavaScript. {} is (an empty) JavaScript object; "{}" is JSON data format corresponding to it. –  Amadan Dec 26 at 1:49
 
No. { "data": "value" } is both JSON and JS. –  Neikos Dec 26 at 1:50
show 8 more comments

All I want is to pass an array to JS function

That's an object in JS, not an array. (PHP nomenclature is a bit weird.) And you have successfully passed it. However, when you convert an object into a string (which is what alert has to do), it shows up as [object Object]. If you want the string representation, convert it back into a string:

alert(JSON.stringify(data));

You don't need to JSON.parse it, since it already is an object - you have inserted it as a literal from PHP, not as a string. In fact, running JSON.parse in your code should cause an error, which is why no more alerts - code stops, complaining about bad taste in JSON.parse's mouth.

share|improve this answer
add comment

JSON is a subset of Javascript. Which means that if used appropriately it is valid javascript as well.

In this case you are effectively putting through an object, which is also what your alert has told you. The JSON.parse should then error.

If you want to pass an array you have to change your data source. (Although from the looks of it, an array is not required.)

share|improve this answer
add comment
{"ID":"2","NAME":"John Smith","EMAIL":"[email protected]"} is already a json. 

That's why your alert is [object Object]. Also It's not an array for loop. You can get it's data by this way:

function showEditDiv(data) {
  alert(data);
  alert(data.ID);
  alert(data.NAME); // etc..
}

If you want an array, here's the example.

share|improve this answer
 
Thanks, this is a useful info! The only problem I want an array, not an object. –  tcxbalage Dec 26 at 1:59
 
So what do you want when use "alert(data[i]);"? The ID with value equa 2? Or the whole object with all of info above? –  hicurin Dec 26 at 2:02
 
Well that is a good question :) I'm not familiar with JS, I need a same associative array than I have in the PHP, therefore as you pointed out, my code is completely wrong. –  tcxbalage Dec 26 at 2:11
add comment

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.