jQuery-form-serializer

<script src="path/to/jQuery.js"></script>
<script src="path/to/jQuery-serializer.js"></script>
<script>
    $("form")
        .serializer();
        .on("serializer:data", function (e, formData) {
            alert(JSON.stringify(formData));
        })
        ;
</script>

When passing the data-convert-to attribute, the value will be converted in that data type. Currently the following are supported:

• string
• number
• boolean

data-field is mandatory for the fields which you want to be listed in the JSON object.

Inspect the HTML with the browser developer tools so you can see what's behind this pretty form.

Content

{ "name": { "first": "Johnny" , "last": "B." } , "age": 19 , "developer": true , "bio": "I'm a web developer and pianist from Romania." }

Fill Form

First name

Enter your first name.

Last name

Enter your first name.

Age

How old are you? If you provide 0, the age field will be deleted.

Developer

How old are you? If you provide 0, the age field will be deleted.

Bio

I'm a web developer and pianist from Romania.

Readonly

I'm readonly content and my value is taken with data-value="html".

Submit