Turn a form into an associative array in Jquery [duplicate]

Question

I have the following form:

<form id="editForm">
<input class="span12" name="name" type="text" placeholder="Product name...">
<input class="span12" name="sku" type="text" placeholder="SKU...">
<input name="basePrice" class="span12" type="text" placeholder="Base price...">
</form>

How do I turn that into an associative array that can be accessed like the following?

formArray['name'], formArray['sku'], etc.

in other words, you want an object with key/value pairs. You'll have to do it manually by iterating over the form inputs or accessing them 1 by 1. — Kevin B
– Kevin B, Commented Nov 6, 2013 at 19:14
@imperium2335 Right, that's why i didn't suggest serializeArray. — Kevin B
– Kevin B, Commented Nov 6, 2013 at 19:42
Have you check this : stackoverflow.com/questions/1184624/… — Bhavik Hirani
– Bhavik Hirani, Commented Mar 26, 2018 at 8:01

Evan Davis · Accepted Answer · 2013-11-06 19:18:23Z

15

Here's a dead-simple way:

$.fn.form = function() {
    var formData = {};
    this.find('[name]').each(function() {
        formData[this.name] = this.value;  
    })
    return formData;
};

// use like
var data = $('#editForm').form();

This is totally unsafe and just grabs everything with a name, but it should get you started.

answered Nov 6, 2013 at 19:18

Evan Davis

36.7k7 gold badges53 silver badges58 bronze badges

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

1 Comment

morgandigital Over a year ago

This is a terrific answer. Just check the values server-side and you are good.

Collectives™ on Stack Overflow

Turn a form into an associative array in Jquery [duplicate]

1 Answer 1

1 Comment

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Linked

Related