День 15. Формы. Без фреймов. Только формы.
Основой для создания форм служит элемент... Form. Гениальное имя.Атрибуты же этого элемента отвечают в основном за обработку данных, введенных в форме, а не за ее внешний вид, поэтому приготовьтесь размышлять абстрактно.
Основным атрибутом является атрибут action. Именно он указывает на обработчик данных
для формы. Название файла-обработчика будет являться значением для атрибута action. Но вы
помните, что такого файла у нас нет, поэтому для проверки работоспособности наших форм мы
будем использовать в качестве значения адрес электронной почты, указав перед ним ключевое
слово mailto. После того, как форма будет заполнена и мы нажмем на кнопку отправить, откроется почтовый клиент и вроде бы нам должны предложить отправить на заданную электронную почту письмо с данными.
Неудобно? неудобно. Зато сможем проверить работает ваще наша форма или не работает.
Есть еще важный атрибут enctype. Он сообщает тип объекта, который отправляется вместе с формой.
Например, вы можете фотографию свою отправлять, а это уже не просто текст вам натыкивать.
Вообще, в качестве значения атрибута enctype должен быть MIME-тип объекта, пересылаемого вместе с формой.
Коли мы заговорили, что формы че-то куда-то отправляют(реально они отправляют данные на сервер, наверное), то важным становится способ отправки. Он задается атрибутом method, который может иметь два значения - get и post. Get отправляет текстовую информацию через адресную строку. Вы наверняка видели как у вас в браузере, после нажатия на ссылку, в адресной строке появляется длиннюююющая запись в которой много & и ?.
Вот это и реализуется метод get.
Метод же post передает большие объемы информации, данные содержатся не в строке, а в сообщении, который пересылает компьютер на сервер.
Для того, чтобы чувак-крутейший программист смог написать нам обработчик, нужно задать для формы уникальное имя. Задается оно с помощью атрибута name.
Ну и еще один атрибут - target. Он, как и в других элементах, определяет в каком окне будет выводиться результат обработки формы. Значения он может принимать те же самые, что и ранее.
СОЗДАНИЕ ПОЛЕЙ ФОРМ.
Переходим к рассказу о том, как же я создавал сегодня первые свои формы.
Делал я это с помощью элемента INPUT. Главным его атрибутом является type, который определяет тип информации, которую нужно занести в поле формы. Для создания текстовых полей нужно этому атрибуту определить значение text.
Для текстовых полей можно определить длину поля ввода и максимальное количество символов для ввода. Делается с помощью атрибутов size и maxlenght, соответственно.
Кстати, для каждого поля нужно задать имя в атрибуте name, это надо опять же для программиста, которого у нас нет, чтобы он, когда будет, мог с этими полями работать.
Для определения поля как поля пароля(смешно звучит, правда?)))))), нужно в качестве значения атрибута type задать password.
Тогда текст, который мы вводим, будет отображаться не символами, а точками или звездочками.
Еще есть полезный атрибут value, который задает значение по умолчанию для поля. Это полезно, т.к. с его помощью можно поставить в поле пример заполнения и человек, которму нужно заполнить форму, сможет это делать как бы по образцу.
А это калево.
Вот вам пример:
<html>
<head>
<title>Простая форма</title>
</head>
<body>
<form action="mailto:alexeyhan@ya.ru" enctype="text/plain" method="post" name="simpleform" target="_blank">
Имя:<input type="text" name="Reg_name" value="Ваше имя"/><br/>
Фамилия:<input type="text" name="Reg_surname" value="Ваша фамилия"/><br/>
Отчество:<input type="text" name="Reg_patronym" value="Ваше отчество"/><br/>
Введите логин:<input type="text" name="Reg_login"/><br/>
Пароль:<input type="password" name="Reg_pass"/><br/>
</form>
</body>
</html>
Форма с кнопками:
Без кнопок то и форма не форма. Как же люди будут нам отправлять готовые формы нам, если у них некуда тыкнуть даже для этого.
Чтобы тыкать было куда нужно придать атрибуту type значение submit для выполнения того, что написано в action,
либо reset, чтобы сбросить все к чертовой бабушке.
С помощью атрибута value можно задать надпись, отображаемую на кнопке.
Пример формы с кнопками:
<html>
<head>
<title>Простая форма</title>
</head>
<body>
<form action="mailto:alexeyhan@ya.ru" enctype="text/plain" method="post" name="simpleform" target="_blank">
Имя:<input type="text" name="Reg_name" value="Ваше имя"/><br/>
Фамилия:<input type="text" name="Reg_surname" value="Ваша фамилия"/><br/>
Отчество:<input type="text" name="Reg_patronym" value="Ваше отчество"/><br/>
Введите логин:<input type="text" name="Reg_login"/><br/>
Пароль:<input type="password" name="Reg_pass"/><br/>
<input type="submit" name="submit" value="Отправить данные">
<input type="reset" name="reset" value="Сбросить данные">
</form>
</body>
</html>
Итог
Формы - клевые. Серьезно. Это очень полезная вещь.До завтра, друзья.
Комментариев нет:
Отправить комментарий