Как создать свой сайт бесплатно? Как сделать сайт своими руками? Как заработать в Интернете? Создание сайтов на заказ.

Запрос должен быть не менее 4-х символов.

RSS-лента

Сегодня:        Добавить в Избранное       Написать Автору        Обмен валют        Оплата сервисов

Формы на web-страницах сайта.

Автор: Андрей Краснокутский

Дата: 2010-06-18

Для чего нужны формы на сайте.

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

Форма — это инструмент, с помощью которого HTML-документ может отправить информацию в заранее определенную точку внешнего мира. Формы применяються для опроса посетителей, покупки чего-либо (заказа товара(ов)), отправки электронной почты.

Принцип работы форм следующий: посетитель, зашедший к вам на сайт заполняет определенную форму (вносит туда нужные данные), а после нажатия определенной кнопки форма берет данные из заполненых полей и отправляет их в назначенное место.

Формы размещаются между тэгами <FORM> </FORM>. HTML-документ может содержать в себе несколько форм, но они не должны находиться одна внутри другой. Тэг <FORM> может содержать следующие атрибуты:

ACTION Обязательный атрибут. Определяет, где находится обработчик формы.
METHOD Определяет, каким образом данные из формы будут переданы обработчику. Допустимые значения: METHOD=POST и METHOD=GET. Если значение атрибута не установлено, по умолчанию предполагается METHOD=GET.
ENCTYPE Определяет, каким образом данные из формы будут закодированы для передачи обработчику.

Обратите внимание на первую строку в таблице выше. В правом столбце Вы прочитали такую фразу: ... обработчик формы. Это значит, что кроме файла с формой (куда вносятся данные) существует еще один файл (или скрипт), который обрабатывает полученные из формы данные, а уже затем отправляет дальше. Обычно это происходит скрыто и посетитель сайта даже не догадывается об этом. Но про Обработчик мы поговорим позже.

Для внесения информации пользователем в форму используется элемент <INPUT> Это и есть поля, в которые пользователь вводит информацию. Каждый элемент <INPUT> включает атрибут NAME=имя, определяющий имя данного поля (идентификатор поля). В таблице ниже представлены основные типы, применяемых элементов <INPUT>:

 

TYPE=text
Определяет окно для ввода строки текста. Может содержать дополнительные атрибуты SIZE=число (ширина окна ввода в символах) и MAXLENGTH=число (максимально допустимая длина вводимой строки в символах):

<INPUT TYPE=text SIZE=20 NAME=User VALUE="Сайт LuksWeb.ru">

Простая форма с полем шириной 20 символов для ввода текста. По умолчанию в окне находится текст Сайт LuksWeb.ru, который пользователь может изменить.

 

TYPE=password
Определяет окно для ввода пароля. Абсолютно аналогичен типу text, только вместо символов вводимого текста показывает на экране звездочки (*):

<INPUT TYPE=password NAME=PW SIZE=20 MAXLENGTH=10>

 

TYPE=radio
Определяет радиокнопку. Может содержать дополнительный атрибут CHECKED (показывает, что кнопка отмечена). В группе радиокнопок с одинаковыми именами может быть только одна помеченная радиокнопка:

<INPUT TYPE=radio NAME=Question VALUE="Yes" CHECKED> Да
<INPUT TYPE=radio NAME=Question VALUE="No"> Нет
<INPUT TYPE=radio NAME=Question VALUE="Possible"> Возможно

Да
Нет
Возможно

Определяет группу из трех радиокнопок, подписанных Yes, No и Possible. Первоначально помечена первая из кнопок. Если пользователь не отметит другую кнопку, обработчику будет передана переменная Question со значением Yes. Если пользователь отметит другую кнопку, обработчику будет передана переменная Question со значением No или Possible. Одновременно можно выбрать только одно значение.

 

TYPE=checkbox
Определяет квадрат, в котором можно сделать пометку. Может содержать дополнительный атрибут CHECKED (показывает, что квадрат помечен). В отличие от радиокнопок, в группе квадратов с одинаковыми именами может быть несколько помеченных квадратов:

<INPUT TYPE=checkbox NAME=Comp VALUE="CPU"> Процессоры
<INPUT TYPE=checkbox NAME=Comp VALUE="Video" CHECKED> Видеоадаптеры
<INPUT TYPE=checkbox NAME=Comp VALUE="Scan"> Сканеры
<INPUT TYPE=checkbox NAME=Comp VALUE="Modem" CHECKED> Модемы

Процессоры
Видеоадаптеры
Сканеры
Модемы

Определяет группу из четырех квадратов. Первоначально помечены второй и четвертый квадраты. Если пользователь не произведет изменений, обработчику будут переданы две переменные: Comp=Video и Comp=Modem. Одновременно можно выбрать любое количество значений.

 

TYPE=hidden
Определяет скрытый элемент данных, который не виден пользователю при заполнении формы и передается обработчику без изменений. Такой элемент иногда полезно иметь в форме, которая время от времени подвергается переработке, чтобы обработчик мог знать, с какой версией формы он имеет дело.

<INPUT TYPE=hidden NAME=version VALUE="1.1">

Определяет скрытую переменную version, которая передается обработчику со значением 1.1.
TYPE=submit Определяет кнопку, при нажатии на которую запускается процесс передачи данных из формы обработчику:

<INPUT TYPE=submit VALUE="Отправить">

 

TYPE=reset
Определяет кнопку, при нажатии на которую очищаються поля формы. Поскольку при использовании этой кнопки данные обработчику не передаются, кнопка типа reset может и не иметь атрибута name:

<INPUT TYPE=reset VALUE=" Сброс ">

 

Формы могут содержать поля для ввода большого текста <TEXTAREA>:

<TEXTAREA NAME=address ROWS=5 COLS=50> Наберите здесь своё сообщение</TEXTAREA>

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

 

Кроме всего этого все формы могут содержать меню выбора или как иногда говорят "Выпадающий список", которое начинается открывающимся тэгом <SELECT> (содержит обязательный атрибут NAME, определяющий имя меню) и завершается закрывающимся </SELECT>. Между ними находятся тэги <OPTION>, определяющие элемент меню. Обязательный атрибут VALUE устанавливает значение, которое будет передано обработчику, если выбран этот элемент меню. Тэг <OPTION> может включать атрибут selected, показывающий, что данный элемент выбран/отмечен по умолчанию.

<SELECT NAME="имя"> 
<OPTION VALUE="option_1" selected>
Телевизор 
<OPTION VALUE="option_2">Телефон 
<OPTION VALUE="option_n">текст n 
</SELECT>

 

Тэг <SELECT> может также содержать атрибут MULTIPLE, присутствие которого показывает, что из меню можно выбрать несколько элементов. Большинство Браузеров показывают меню <SELECT MULTIPLE> в виде окна, в котором находятся элементы меню. Высоту окна в строках можно задать атрибутом SIZE=число.

<SELECT MULTIPLE SIZE=3 NAME="имя"> 
<OPTION VALUE="option_1" selected>
Телевизор 
<OPTION VALUE="option_2">Телефон 
<OPTION VALUE="option_n">текст n 
</SELECT>

 

На этом мы закончим наш первый теоритический урок по формам, в следующем уроке, мы рассмотрим конкретные примеры использования форм на сайте.

Удачи.

 

Читайте так же:

Покупаем Хостинг для сайта.

Как сделать гиперссылку на электронную почту?

Как найти человека в Интернете. Очередной Лохатрон? Или хороший сервис?

eBook Edit Pro одна из лучших программа для создания электронных книг.

Где и как обналичить электронные деньги.

Форматы выпусков Почтовой рассылки.

 

Просмотров: 16125


Поделитесь этой информацией со своими друзьями!


Комментарии к этой статье (уроку):

Комментарии добавил(а): Иван
Дата: 2011-09-30

Прикольно....

Комментарии добавил(а): Вася
Дата: 2013-02-01

Зайдите На Сайт Нужна помощь http://moon

Добавить Ваш комментарий:

Введите сумму чисел с картинки:
Введите сумму чисел

GudzonPartner.com

Новости сайта


05.08.2014
Новый раздел! Платежные системы Интернета. Все о платежных системах и сервисах.

09.08.2013
Новинка! Обзор и Анализ реальных способов заработка. Как и Сколько можно заработать в Интернете? Цифры. Факты. Комментарии.

28.05.2013
Обновилась Партнерка сайта! Зарабатывайте вместе с нами! "Новые товары и рекламные материалы"

25.05.2013
Видео Курс! "Как создать свой Информационный Бизнес в Интернете" Зарабатывайте: от 30000 ++ рублей.

Почтовая рассылка! Бесплатные электронные книги из серии: "Секреты создания сайтов"


Почтовая рассылка

Новинка!
Как реально заработать
в Интернете?
"Обзор видов и способов заработка."

Специальный Отчет:

Специальный Отчет: Как и сколько можно реально заработать в Интернете? Рельные цифры, факты и анализ различных способ заработка в Интернете

В подарок всем подписчикам!

SmartResponder.ru
Ваш e-mail: *
Ваше имя: *

Полный список наших почтовых рассылок!

Домены

Сервис мгновенной регистрации Доменов

Google Adsense



Навигация

Уроки HTML

CSS уроки

Статьи

Инструменты

Шаблоны сайтов

Книги

Украшения

Сайт от А до Я

Заработать в Интернете

Обман в Интернете

Охрана труда

МОДУЛЬНЫЕ КАРТИНЫ

PHP УРОКИ

Услуги

Скрипты

Почтовая Рассылка

SEO

jQuery

Специальная оценка условий труда (СОУТ) - АРМ

Платежные системы Интернета

УРОКИ ФОТОШОП

Секретный раздел

Видео Курсы

Видео курс по созданию сайтов: Сайт от А до Я
С нами сделать сайт
сможет даже Ребёнок!
"Сайт от А до Я"
Узнать сейчас >>>


Хотите заработать?
2-х Уровневая
Партнерская программа!

Присоединяйтесь.


Последние заметки

Модульная картина: Роскошь красного бархата

Модульная картина абстракция: Энергия солнца

Модульная картина: Синие розы

Модульная картина: Водопад

Модульная картина: Орхидеи

Новости сайта

RSS Лента Новостей сайта www.LuksWeb.ru

Наши новости в Твиттере

Архив

2016 год:

2015 год:

2014 год:

2013 год:

2012 год:

2011 год:

2010 год:

2009 год:

2008 год:

Сайты друзей

Регистрация доменов

ООО "ПК "ЛюксСтрой"

Деревянные дома от СПК "Ванда"

Наши ссылки

Если Вам понравился
наш сайт, установите
Нашу ссылку, и
Получите подарки!!!

QR код сайта www.LuksWeb.ru

Наши Аттестаты


Проверить аттестат

 

Аттестован системой Z-PAYMENT
Проверено Z-PAYMENT