JavaScript FormData.get() — значення поля форми
Метод get() повертає перше значення поля — або null, якщо такого поля немає.
Загальний опис
Для текстових полів повертається рядок, для файлових — об'єкт File. Тобто одразу можна дивитись .size і .type, не чіпаючи сам <input>.
Якщо поле повторюється (кілька файлів), метод віддасть лише перше — решту через getAll().
Зручно для валідації перед відправкою: зібрав FormData з форми, перевірив поля, і лише потім відправив.
Переглядачі
| Переглядач | ||||||
|---|---|---|---|---|---|---|
| get | 7+ | 4+ | 5+ | 12+ | 12+ | 10+ |
| Переглядач | ||||
|---|---|---|---|---|
| get | 3+ | yes | yes | 5+ |
Приклади
+ запропонувати свій приклад у пісочниці
Валідація полів і файлу до відправки на сервер.
HTML
<form id="f">
<input name="title" value="Мій допис">
<input name="photo" type="file">
</form>
JS
(async () => {
const form = document.getElementById('f');
const data = new FormData(form);
const title = data.get('title'); // рядок
const photo = data.get('photo'); // об'єкт File
if (!title || title.length < 3) {
console.error('Замалий заголовок');
return;
}
// файл перевіряємо ДО відправлення
if (photo && photo.size > 5 * 1024 * 1024) {
console.error('Файл більший за 5 МБ');
return;
}
console.log('Валідно, надсилаємо:', title);
try {
await fetch('/api/save', { method: 'POST', body: data });
} catch (error) {
console.log('У пісочниці немає сервера:', error.message);
}
})();
Коментарі
Коментарів ще немає — будьте першим!