How to put all form's data into JSON on javascript?

Question

I have the next form:

<form id="form">
<input type="checkbox" name="numbers" value="1">
<select name="ordering[numbers]">
    <option value="ASC">Ascend</option>
    <option value="DESC">Descend</option>
</select><br>
<input type="checkbox" name="added_date" value="1"> Call date 
<select name="ordering[added_date]">
    <option value="ASC">Ascend</option>
    <option value="DESC">Descend</option>
</select>
</form>

Basically I need to save all data to JSON object before submitting form, let's call it form_json I'm using jQuery.serializeArray() function

var form_json = $("#form").serializeArray();

I get the next object if both of checkboxes are checked:

[
    {"name": "numbers", "value": "1"},
    {"name": "ordering[numbers]", "value": "ASC"},
    {"name": "added_date","value":"1"},
    {"name": "ordering[added_date]", "value": "ASC"}
]

Which is not what I was expected. I want to have the next format somehow:

[
    {"name": "numbers","value": "1"},
    {"name": "added_date","value": "1"},
    {"name": "ordering", "value": {
            "numbers": "ASC",
            "added_date": "ASC"}
    }  
]

Is that possible to do that? Thanks!

Rick · Accepted Answer · 2012-04-17 14:22:15Z

1

I'm not sure if .serializeArray() will create that structure. You'll have to add the rest of the form in, but this might get you closer.

http://jsfiddle.net/YSEZt/2/

var ordering = {"name" : "ordering", "values" : {}};
ordering.values[$("select[name='ordering[numbers]']").prop('name')] =   $("select[name='ordering[numbers]']").val();    
ordering.values[$("select[name='ordering[added_date]']").prop('name')] =      $("select[name='ordering[added_date]']").val();
console.log(ordering)

answered Apr 17, 2012 at 14:22

Rick

1,5739 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to put all form's data into JSON on javascript?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related