Setting Hidden Field Value to JSON (jQuery/JavaScript)

Question

var c = [{"Id":40,"Action":null,"Card":"0484"}];
$('#hidJson', window.parent.document).val(c);
alert($('#hidJson', window.parent.document).val()); // returns [object Object]
alert($('#hidJson', window.parent.document).val()['Card'); // returns undefined

I'm in a legacy app. I have had to put in a fix where an IFrame needs to get a packet of JSON back to a parent.document. Then the data will be available server-side after I submit the parent doc.

Using alert to try to figure out what is happening. Do I need to encode the JSON first ( before I set it on the 2nd line of the JS.

UPDATE: I see what it is doing now. It is setting the value in the DOM like so.

<input id="hidJson" name="hidJson" type="hidden" value="[object Object]" />

Answer 1

yes. otherwise you'll set the hidden to the result of `c.toString(). firefox has .toSource() but that's not portable. see http://www.json.org/ for an implementation.