CODEWITHSUNDEEP
javascriptjquery
stackdisplay
stackdisplay

Reputation: 2045

FormData based on form id or name

I have a button outside of form data. When i submit the form, i can get the serialize value but not FormData. How can i get the FormData?

function submitForm() {
  console.log($('#form1').serialize());
  console.log(new FormData(document.getElementById('form1')));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form id="form1" name="form1">
    <input type="firstname" value="First Name" name="firstname">
    <input type="lastname" value="Last Name" name="lastname">
</form>
<button onclick="submitForm()">Submit</button>

Upvotes: 2

Views: 18488

Answers (1)

Phil
Phil

Reputation: 164830

From the documentation...

Syntax

var formData = new FormData(form)

Parameters

form
An HTML <form> element — when specified, the FormData object will be populated with the form's current keys/values using the name property of each element for the keys and their submitted value for the values. It will also encode file input content.

You are passing a jQuery object, not a form element. Instead, try

console.log(new FormData(document.getElementById('form1'))) // by id

or

console.log(new FormData(document.forms.form1)) // by name

or if you still like jQuery

console.log(new FormData($('#form1')[0]))

Upvotes: 11

Related Questions