Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Ron McLeod
  • Junilu Lacar
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • Jeanne Boyarsky
  • Rob Spoor
  • Bear Bibeault
Saloon Keepers:
  • Tim Moores
  • Tim Holloway
  • Piet Souris
  • Carey Brown
  • Stephan van Hulst
Bartenders:
  • Frits Walraven
  • fred rosenberger
  • salvin francis

Iterating a JSON in jQuery

 
Ranch Hand
Posts: 544
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Report post to moderator
Hi ,
I am trying to do the following
1) In parent HTML have a hidden form field that holds data in JSON format. The example below shows one property value pair per JSON object in an array.
e.g <input type="hidden" id="usethis" value={"items":[{"name":"Item 1"},{"name:"Item 2"}]}/>
2) In the new window which is opened from this parent window, I need to access this hidden field and use the value to populate the SELECT box.

To do this I tried using this in document.ready


This fails to read the JSON array.
Can someone please let me know if there is any inbuilt function other than each to parse the JSON? Or I have to use some third party JS library (listed on json.org) to parse this JSON ?
I am not able to resolve this issue and hence seeking some help here.

Thanks and Regards,
Amit
 
Sheriff
Posts: 67556
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Report post to moderator

amit punekar wrote:This fails to read the JSON array.


Fails how? At what point does the problem begin? Have you debugged to find out if the JSON string is being correctly evaluated in the first place?

Can someone please let me know if there is any inbuilt function other than each to parse the JSON?


$.each() doesn't parse the JSON, eval() does.

Do you understand how JSON works? Once it's evaluated, the result is just a JavaScript data structure like any other.
 
amit punekar
Ranch Hand
Posts: 544
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Report post to moderator
Hi,
thanks once again for your reply.
I did debug using Google Chrome Developer tool.
It showed me error while evaluating the string read from parent window.
I re-checked my JSON string to see if I have extra ":" or quotes. But they look good.

The actual error that Chrome shows me is


Regards,
Amit

Update:
I could get eval working by enclosing the JSON string within brackets.
so the value now looks like

 
Bear Bibeault
Sheriff
Posts: 67556
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Report post to moderator
Well, if the JSON doesn't evaluate correctly, then of course the rest of the script (including the jQueryeach() method) won't work.

Did you check to see if your JSON string is correctly making it to the page. The syntax of your input element is suspect.

Also, in order to eval(), a full and valid expression is needed. Try:

 
amit punekar
Ranch Hand
Posts: 544
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Report post to moderator
Hi Bear,
Thanks for the reply.
Just posted an update to my post and saw your reply.
Did the same to have eval work.
Now looking into iterating it using each funtion.

Another Update:
Got the iteration on JSON working.
Did two mistakes.
1) Did not have enclosing brackets for the JSON String that was passed from parent window to child window.
2) In jQuery.each tried to iterate "data" instead of "data.items" json array. We can iterate on data as well but then we will need to write another iterator function for iterating the only element "items" in it. Hence I preferred to directly iterate over "data.items".

Thanks for your help,
Amit
 
Bear Bibeault
Sheriff
Posts: 67556
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Report post to moderator
 
amit punekar
Ranch Hand
Posts: 544
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Report post to moderator
Hello,
I have implemented an UI based on jQuery event handlers that moves the OPTIONs between two HTML SELECT boxes.

It works great and fine but there is an issue that I have observed.

When the page comes up the double clicking on OPTION does not move the item to another HTML select. After that second double click onwards it starts responding and moving the OPTION items between the two lists.
I have written a JS function to move the items between two list and binding it to the double click event in document.ready() event.

Thanks once again,
Amit
 
Bear Bibeault
Sheriff
Posts: 67556
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Report post to moderator
As this is a completely different issue, I'm going to close this topic and let you open a new one to address this problem. Be sure to include relevant code fragments.
 
Onion rings are vegetable donuts. Taste this tiny ad:
Building a Better World in your Backyard by Paul Wheaton and Shawn Klassen-Koop
https://coderanch.com/wiki/718759/books/Building-World-Backyard-Paul-Wheaton
    Bookmark Topic Watch Topic
  • New Topic