Атрибут name тега <button>

Описание

Атрибут name задает имя кнопки, которое будет отправлено на сервер вместе с данными формы. Это особенно полезно, когда форма содержит несколько кнопок и нужно определить, какая именно была нажата.

Пример использования:
<form action="/process" method="post"> <input type="text" name="username"> <button type="submit" name="action" value="save">Сохранить</button> <button type="submit" name="action" value="delete">Удалить</button> </form>

Основные характеристики:

Аспект Поведение Примечание
Отправка данных Имя и значение кнопки включаются в данные формы Только для нажатой кнопки
Группировка Кнопки с одинаковым name работают как группа Полезно для радиокнопок
Доступ из JS Можно обращаться через document.forms По имени формы и кнопки

Практический пример:

<form name="userForm"> <button type="submit" name="submitType" value="approve">Одобрить</button> <button type="submit" name="submitType" value="reject">Отклонить</button> </form> <script> document.userForm.addEventListener('submit', function(e) { const action = new FormData(this).get('submitType'); console.log('Выбрано действие:', action); }); </script>

Важные замечания:

  • Работает только с кнопками внутри формы
  • Для type="submit" отправляет name и value на сервер
  • Не путать с атрибутом id - name для сервера, id для клиента
  • Может использоваться без value (отправит пустое значение)

Примечание: Используйте осмысленные имена для кнопок, соответствующие их функции в форме. Это упрощает обработку данных на сервере.