name: ключ данных при отправке формы

Назначение

Атрибут name задаёт имя, под которым значение элемента формы попадает в отправляемые данные.

Как это работает

id связывает поле с подписью, а name задаёт ключ передачи. Несколько полей могут иметь одинаковое name, например группа radio или список checkbox. Обработчику нужно учитывать возможность нескольких значений.

Пример

<form><label for="reader">Имя читателя</label><input id="reader" name="reader_name" value="Анна">
<label><input type="checkbox" name="topic" value="html" checked> HTML</label>
<label><input type="checkbox" name="topic" value="css" checked> CSS</label></form>

Что должно получиться

Имя отправляется под ключом reader_name. Две отмеченные темы дают повторяющийся ключ topic, а не автоматически созданный JavaScript-массив.

Граница применения и частая ошибка

Поле с id, но без name, может выглядеть полностью рабочим и при этом не попасть в штатную отправку формы. Не путайте идентификатор DOM с именем параметра.

Самостоятельная проверка

В отдельном проекте прочитайте new FormData(form). Добавьте ещё один checkbox с тем же name и проверьте getAll, а не только get для повторяющегося ключа.

HTML и CSS можно изменить в песочнице ниже. Она изолирована: JavaScript, внешние ресурсы и отправка форм отключены. Для проверки сетевых запросов, отправки данных или функций браузера используйте отдельную локальную страницу.

Связанные материалы

• Формы HTML
• Элемент input
• Проверка с клавиатуры