JavaScript FormData.get() — значення поля форми


Метод get() повертає перше значення поля — або null, якщо такого поля немає.

автор: NagarD

Загальний опис

Для текстових полів повертається рядок, для файлових — об'єкт File. Тобто одразу можна дивитись .size і .type, не чіпаючи сам <input>.

Якщо поле повторюється (кілька файлів), метод віддасть лише перше — решту через getAll().

Зручно для валідації перед відправкою: зібрав FormData з форми, перевірив поля, і лише потім відправив.

автор: NagarD

Переглядачі

Підтримка: стаціонарні переглядачі
Переглядач Google Chrome Mozilla Firefox Apple Safari Opera Microsoft EDGE Microsoft Internet Explorer
get 7+ 4+ 5+ 12+ 12+ 10+
Підтримка: мобільні переглядачі
Переглядач Mobile Google Android Mobile Google Chrome Mobile Mozilla Firefox Mobile Apple Safari
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);
    }
})();
автор: NagarD

Коментарі

Коментарів ще немає — будьте першим!

Відповідь для

Увійдіть — коментар з'явиться одразу, без капчі й очікування перевірки.

Пропозиція правки

Ваша версія — : після перевірки замінить чинну. Нова порада чи нотатка — з'явиться на сторінці після перевірки.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія секції «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Ваша версія опису «»: після перевірки замінить чинну.

Ви гість — діють добові ліміти. Увійдіть, щоб пропонувати без капчі.

Зворотний зв'язок
Вхід