Представьте, что вы предлагаете пользователю выбор: доставить товар курьером или почтой. Использовать чекбоксы в этом случае не получится, ведь выбор строго один.
Для создания переключателей, которые умеют обрабатывать только один из множества вариантов, существуют радиокнопки. Название они получили от старых автомобильных радиоприёмников, в которых выбор радио осуществлялся нажатием на одну из множества кнопок для выбора частоты.
Выбор радиостанции
Для создания радиокнопки, так же, как и чекбокса, используются два тега:
<input> с указанием type="radio". Обязательным атрибутом является name, значением которого является имя. Данное имя должно быть одинаковым у всей группы радиокнопок. Без этого атрибута будет возможно выбрать все значения сразу, так как браузер не будет видеть связи между ними<label>, в котором будет текст, связанный с нужной нам радиокнопкойСвязь <input> с <label> происходит уже по одному из двух знакомых нам сценариев:
id. Для этого необходимо задать уникальный id для <input>, и связать <label> с радиокнопкой с помощью атрибута for <form>
<input id="yes" type="radio" name="question">
<label for="yes">Да</label>
<input id="no" type="radio" name="question">
<label for="no">Нет</label>
</form>
<input> внутрь тега <label>. При этом указание уникального id не требуется <form>
<label>
<input type="radio" name="question">
Да
</label>
<br>
<label>
<input type="radio" name="question">
Нет
</label>
</form>
Для того чтобы после отправки формы на сервер возможно было узнать, какой именно пункт был выбран, используется атрибут value, внутри которого находится значение, позволяющее определить радиокнопку.
<form>
<label>
<input type="radio" name="question" value="yes">
Да
</label>
<br>
<label>
<input type="radio" name="question" value="no">
Нет
</label>
</form>
Создайте форму, у которой файл с обработчиком данных лежит по адресу /people. Внутри формы создайте 2 радиокнопки. Свяжите их вложив <input> внутри <label>. Уникальное имя для радиокнопок delivery. Не забудьте добавить атрибут value
Если вы зашли в тупик, то самое время задать вопрос в «Обсуждениях». Как правильно задать вопрос:
Тесты устроены таким образом, что они проверяют решение разными способами и на разных данных. Часто решение работает с одними входными данными, но не работает с другими. Чтобы разобраться с этим моментом, изучите вкладку «Тесты» и внимательно посмотрите на вывод ошибок, в котором есть подсказки.
Это нормально 🙆, в программировании одну задачу можно выполнить множеством способов. Если ваш код прошел проверку, то он соответствует условиям задачи.
В редких случаях бывает, что решение подогнано под тесты, но это видно сразу.
Создавать обучающие материалы, понятные для всех без исключения, довольно сложно. Мы очень стараемся, но всегда есть что улучшать. Если вы встретили материал, который вам непонятен, опишите проблему в «Обсуждениях». Идеально, если вы сформулируете непонятные моменты в виде вопросов. Обычно нам нужно несколько дней для внесения правок.
Кстати, вы тоже можете участвовать в улучшении курсов: внизу есть ссылка на исходный код уроков, который можно править прямо из браузера.