Forum Moderators: open

Message Too Old, No Replies

JSON from jquery .each() function

Create json object or array from dynamically generated content

         

nugg79

9:24 pm on Oct 24, 2013 (gmt 0)

10+ Year Member



I am currently using jQuery UI accordion to display kids names on an enrollment form. These are dynamically created earlier on the page before the submit action. On submit of the page, I want to pull each child with their corresponding information into a format like JSON or XML to pass to the server. I know I have to create a $("element").each() but am unsure how to loop through to get each group of information. The generated html surrounding the kids info is as follows:


<!--kids name-->
<h3 class="kid_name_final ui-accordion-header ui-helper-reset ui-state-default ui-accordion-header-active ui-state-active ui-corner-top ui-accordion-icons" role="tab" id="ui-accordion-kid-header-0" aria-controls="ui-accordion-kid-panel-0" aria-selected="true" tabindex="0">
<span class="ui-accordion-header-icon ui-icon ui-icon-triangle-1-s"></span>
<span class="kid_first">sandy</span>
<span class="kid_middle"></span>
<span class="kid_last">jones</span>
<span class="kid_suffix"></span>
</h3>
<!--kids information-->
<div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" style="display: block; height: 70px;" id="ui-accordion-kid-panel-0" aria-labelledby="ui-accordion-kid-header-0" role="tabpanel" aria-expanded="true" aria-hidden="false">
<ul>
<li class="kid_DOB_final">01/10/2003</li>
<li class="kid_SSN_final">444-44-4444</li>
<li class="kid_final_edit"><a href="javascript:void(0);" class="editChild_form">edit</a> / <a href="javascript:void(0);" class="remove_child">remove</a></li>
</ul>
</div>

<!--the next kid would begin here with the same code-->


Here is the the pattern I believe I should be receiving to get the data:

{
"child":
{
"name":
[
"first": "Bill",
"middle": "M",
"last": "Smith",
"suffix": ""
]
"DOB": "12/1/1995",
"ssn": "222-22-2222"
},
"child":
{
"name":
[
"first": "Mary",
"middle": "A",
"last": "Smith",
"suffix": ""
]
"DOB": "1/12/1999",
"ssn": "333-33-3333"
},
"child":
{
"name":
[
"first": "Jeremy",
"middle": "Q",
"last": "Smith",
"suffix": "Jr"
]
"DOB": "07/9/2003",
"ssn": "555-55-5555"
}

}



Any ideas to get my on my way? Thanks in advance.

daveVk

12:57 am on Oct 28, 2013 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



These are dynamically created earlier on the page


Then I assume data on each kid is already held in JSON array or other data structure ?

So is kids 3 and 7 are selected, get data from 3,7 in that array/structure ?