This content originally appeared on DEV Community and was authored by Silvestar Bistrović
When you disable the fieldset element before reading the form data using the FormData constructor, the data will be empty.
// Find my form
const $form = document.querySelector('.my-form')
// Find all fieldsets inside my form
const $fieldsets = $form.querySelectorAll('fieldset')
// Set all fieldsets as disabled
if($fieldsets.length) {
$fieldsets.forEach($fieldset => {
$fieldset.setAttribute('disabled', true)
})
}
// Construct FormData from the form
const formData = new FormData($form)
// You cannot log formData directly
console.log(Array.from(formData))
// Output: [] - doesn't work
So, if you want to disable the fieldset element, you should do it after using the FormData constructor.
// Find my form
const $form = document.querySelector('.my-form')
// Find all fieldsets inside my form
const $fieldsets = $form.querySelectorAll('fieldset')
// Construct FormData from the form
const formData = new FormData($form)
// You cannot log formData directly
console.log(Array.from(formData))
// Output: [] - works
// Set all fieldsets as disabled
if($fieldsets.length) {
$fieldsets.forEach($fieldset => {
$fieldset.setAttribute('disabled', true)
})
}
Also, if your fields are disabled, they won’t be included in the FormData, too.
Here’s a little demo of what works and what doesn’t work.
This content originally appeared on DEV Community and was authored by Silvestar Bistrović
Silvestar Bistrović | Sciencx (2022-01-30T16:19:32+00:00) FormData doesn’t include disabled fieldsets. Retrieved from https://www.scien.cx/2022/01/30/formdata-doesnt-include-disabled-fieldsets/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.