Html5: Значение атрибута, указанного в флажке/радио

При отправке формы, как бы вы могли пометить флажок/радиообъект по мере необходимости?

Источник вдохновения: Pekka ответить на question

Ответ 1

Необходимые флажки не являются необычными. Практически каждая форма регистрации использует определенную форму флажка "Я прочитал и согласен с Пользовательским соглашением".

Если у вас есть Opera, попробуйте код ниже. Форма не будет отправлена, если флажок не установлен.

<!doctype html>
<html>

<head>
  <title>html5</title>
</head>

<body>
  <h1>html5 test</h1>
  <form action="/">
    <input type="checkbox" required="required" id="cb" name="cb">
    <label for="cb">required checkbox</label>
    <input type="submit">
  </form>
</body>

</html>

Ответ 2

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

Чтобы выбрать один переключатель в группе, либо начинайте с выбора по умолчанию, либо выполните проверку с помощью javascript. Для этого нет HTML-способов, потому что все возможные варианты действительны.

В html5 есть флажок required для флажков.

Они как-то странны, поэтому позвольте мне привести что-то, чтобы объяснить, как они работают.

Для флажков требуемый атрибут должен выполняться только тогда, когда отмечены один или несколько флажков с этим именем в этой форме.

Для радиокнопки требуемый атрибут должен выполняться только тогда, когда установлен один из переключателей в этой группе радио.

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

Ответ 3

Я тестировал требуемый атрибут для Radio Buttons сегодня на Firefox 17.0.1 на XP SP2.

Кажется, что он соответствует спецификации требуемого атрибута для переключателей/групп. Когда Firefox подскажет "Пожалуйста, выберите один из этих параметров". для обоих фрагментов кода ниже:

Либо вы устанавливаете обязательный атрибут для каждого из переключателей

<input type="radio" name="gender" value="male" required="required" />
<input type="radio" name="gender" value="female" required="required" />

Или любой из элементов радиосвязи

<input type="radio" name="color" value="blue" />
<input type="radio" name="color" value="red" required="required" />
<input type="radio" name="color" value="green" />

Любые комментарии и обновления приветствуются.

Ответ 4

Я просто попробовал это на радиокнопке в Firefox 4. Добавляя required к одному радиовходу, затем отправляя перед его выбором, запускает подсказку "Пожалуйста, выберите одну из этих опций".

например. это работает:

<input type="radio" name="gender" value="m" required />
<input type="radio" name="gender" value="f" />