Выпуск №9. HTML формы.

Всем привет!

В этом уроке речь пойдет о html формах.

Формы – это те поля, куда мы, например, вводим свои данные при регистрации на каком – либо сайте, форуме и т.д.

Предложу начать с примера, потом подробно его разберем и рассмотрим виды форм.

И так, начнем.

<form action="" method="get">
<input type="text" name="t1" maxlength="25" size="40" />
<input type="text" name="t2" maxlength="25" size="40" />
<input type="button" name="but" value="отправить данные" />
</form>

Все формы начинаются с тега <form> и заканчиваются тегом </form>.

Далее, параметр action в теге указывает на адрес программы (скрипта), которая будет обрабатывать данные из нашей формы.

Параметр method указывает на способ передачи данных.

Есть два способа: GET и POST. GET:при передачи этим способом, данные добавятся в конец адрес сайта (URL), и мы их увидим в адресной строке.

Если будем передавать методом POST, то данные будут переданы скрыто от пользователя.

Тег <input> определяет как раз саму форму. Рассмотрим параметры тега <input>:

Пример использования:

<form action="" method="get">
<input type="checkbox" name="ch1" checked="checked"/>Вариант 1
<input type="checkbox" name="ch2"/>Вариант 2
<input type="checkbox" name="ch3"/>Вариант 3
<input type="checkbox" name="ch4"/>Вариант 4
</form>

RADIO – то же что и checkbox, но пользователь может выбрать только одно значение.

Для создания набора альтернатив вам необходимо создать несколько полей ввода с атрибутом TYPE="RADIO" с разными значениями атрибута VALUE, но с одинаковыми значениями атрибута NAME.

Пример использования:

<form action="" "method="get">
<input type="radio" value="v1" name="ch1"/>Вариант 1
<input type="radio" value="v2" name="ch2"/>Вариант 2
<input type="radio" value="v3" name="ch3" checked="checked"/>Вариант 3
<input type="radio" value="v4" name="ch4"/>Вариант 4
</form>

Тег SELECT имеет один или более параметр между стартовым тегом <SELECT> и завершающим </SELECT>. По умолчанию, первый элемент отображается в строке выбора.

Пример использования:

<form action="" method="get">
<select name="n">
<option>Вариант 1</option>
<option>Вариант 2</option>
<option>Вариант 3</option>
<option>Вариант 4</option>
</select>
</form>

TEXTAREA – Тег (Обращаю внимание! Это именно тег, а не значение параметра type) используется для того, чтобы позволить пользователю вводить свободный текст.

Пример использования:

<form action="" method="get">
<textarea name="namm" rows="4" cols="30">
</textarea>
</form>

На этом завершим данный выпуск, если возникли вопросы, пишите.

Просьба присылать с вопросом ваш код того, что вы делаете.

Так будет проще и мне понять, что у вас не получилось и дать вам четкий ответ, и вам меньше объяснять в письме, что у вас не выходит.

Всегда Ваш, Андрей Бернацкий.

Подписаться

Поделиться

Метки: html формы, создание html форм