Добавление полей в контактную форму в HTML

Этот урок покажет, как добавить поля в контактную форму в HTML . Данный урок – это продолжение туториала Как создать контактную форму в HTML. Если у Вас остались файлы из предыдущего урока, то откройте их, чтобы продолжить работу или же скачайте

Часть 1. HTML

В любом HTML редакторе откройте файл index.html. В нем есть 2 кнопки, созданные элементом input, 1 текстовый элемент и две кнопки, созданные с помощью buttons. Давайте добавим больше разных функций таких как, например, флажки (checkboxes), переключатели (radio buttons) и выпадающий (drop-down) список. Прямо после кнопок Submit (подписать) и Reset (Сброс) добавьте следующий код.

Дополнительные опции:

	USA

	Canada

	Mexico

Вы согласны?

Yes
No

Выберите элемент из выпадающего списка:

	php
	html
	css
	asp
	ajax
	javascript

Давайте разберем несколько интересных моментов в этом коде. Вы, наверное, обратили внимание, что имена, присвоенные к флажкам, не отличаются, как в случае с добавленным ранее текстовым редактором, и в конце у них стоят квадратные скобки. Скобки определяют, что это переменная массива. Вот как это работает. Для каждого чекбокса, массив check[] получает значение нажатого флажка. Например, после того как Вы выбрали два флажка USA и Canada, массив check[] будет иметь значения checked_usa и check_canada.

Ничего фантастического не происходит с переключателями (radio buttons) и выпадающим (drop-down) списком. К двум переключателям мы привязываем имя «cf_radio_button«, так как нельзя выбрать оба переключателя одновлеменно, то нет необходимости каждому давать уникальное имя.

Синтакс выпадающего списка также очень простой. Откройте тэг , перечислите опции, завернутые в тэги … и в конце закройте тегом . У тэга два атрибута – имя (name) и размер (size). Атрибут size определяет количество видимых опций в выпадающем списке.

foreach($_POST['check'] as $value) {
	$check_boxes .= $value." ";
}

$radio_button = $_POST['cf_radio_button'];
$drop_down_item = $_POST['cf_drop_down'];

$body_message .= "Additional options checked: ".$check_boxes."\n";
$body_message .= "Did the customer agree: ".$radio_button."\n";
$body_message .= "Selected item from the dropdown list: ".$drop_down_item;

history.back(1);