| [CM]Jaxson |
Дата: Понедельник, 15.10.2012, 19:49 | Сообщение # 1
|
٩(̾●̮̮̃̾•̃̾)۶
Сообщений: 801
Статус: Offline
|
Вы наверное часто, регистрируясь в форуме, на каком нибудь бесплатном почтовом сервере (вроде Mail.ru), заполняли формы. Нам же сейчас стоит рассмотреть вопрос их создания и использования.
Основной задачей любой формы является передача информации управляющему скрипту, который будет обрабатывать содержимое, заполненное (внесенное) Вами, регистрируя Вас на сервере, помещая информацию о Вас в базу данных, отправляя почтовое сообщение получателю и т.д., в зависимости от того, для чего форма была предназначена. Пока мы еще не рассматривали серверные скрипты (CGI, PHP и т.д.), поэтому изучение форм начнем с отправки сообщений по электронной почте.
Начнем с того, как включается форма в HTML-документ. Форма включается тэгом <form>:
<form action="..." method="..." enctype="...">
action
Указывает на ресурс, который будет обрабатывать эту форму, т.е. URL адрес управляющего скрипта.
method
Указывает метод передачи данных управляющему скрипту. Может принимать значения GET и POST. По умолчанию используется GET.
enctype
Устанавливает метод кодировки данных при передаче Для отправки по почте лучше пользоваться text/plain. В этом случае почтовое сообщение будет передаваться в текстовом формате.
Что же нам следует записать для отправки почтового сообщения, формирующегося из заполненных полей форм. Запись будет следующей:
<form action="mailto:mrharut@narod.ru?SUBJECT=From site" enctype=text/plain method=POST>
Здесь уже записан адрес, по которому сообщений будет передано, это мой E-mail. С помощью Subject задана тема сообщения. Указана текстовая кодировка text/plain и метод отправки - Post. Метод Get пока рассматривать не будем.
Пока еще мы создали совершенно пустую форму. Чтобы предоставить пользователю возможность заполнять поля нас следует знать какими они бывают. Итак, существует три элемента (вида полей) input, select, textarea. Рассмотрим их подробнее.
1. Элемент Input
Этот элемент обеспечивает ввод однострочных полей с информацией. Внутри этого элемента ничего не может быть на уровне кода HTML и поэтому закрывающий тэг отсутствует. У него существует много параметров, которые задают вид вводимой информации:
type
Этот параметр устанавливает тип поля, или иначе тип вводимой информации:
type=text
Устанавливается по умолчанию. Задает однострочное текстовое поле ввода. Размер поля, который измеряется в количестве видимых символов, задается с помошью параметра size. Размер вводимой строки не ограничен, но при надобности может ограничиваться атрибутом maxlength. Если существует начальное значение текста, т.е. содержимое данного поля при загрузке документа, то оно задается с помощью атрибута value. Для присвоения имени полю используется атрибут name. Он для правильности должен присутствовать у любого поля в форме. Пример:
<input type=text size=45 name=file value=Текстовое поле>
type=password
Этот тип поля полностью аналогичен предыдущему текстовому полю, только вместо вводимых символов показывает один символ называемый символом-маской. Во многих браузерах, да и вообще системах символ-маска отображается символом звездочки.
type=checkbox
Предназначается для простых логических параметров или параметров, которые могут принимать множество различных значений. Отображается в виде помечаемого галочкой квадрата. Для задания имени параметра используется атрибут name, а для задания значения параметра используется value. При создании параметров, которые могут принимать много значений, имена квадратов задающих эти значения должны совпадать. Начальное состояние квадрата, т.е. отмечен он или нет, задается атрибутом checked. Этот атрибут не имеет значений и сам используется для определения отмеченности, т.е. если его нет, то квадрат не отмечен.
<input type=checkbox name=send value=yes checked> Показывать мой E-mail.
Значение квадрата посылается только в случае когда он отмечен, поэтому нет атрибута задающего его значение в случае неотмеченности.
type=radio
Часто именуется радиокнопкой (от англ. - radiobutton). Используется для выбора одного значения из списка. Каждая радиокнопка в группе должна иметь одинаковое имя, задаваемое параметром name, а также собственное значение, которое задает атрибут value. Одна радиокнопка должна инициализироваться как отмеченная атрибутом checked.
Ваша любимая телепередача ?<br>
<input type=radio name=tel value=sam checked> Сам себе режисер
<input type=radio name=tel value=camer> Скрытая камера
<input type=radio name=tel value=pole> Поле чудес
<input type=radio name=tel value=melody> Угадай мелодию
type=submit
Создает кнопку, при нажатии на которую содержимое формы будет отправлено. Текст кнопки задается атрибутом value. Если кнопка имеет атрибут name, то браузер посылает пару имя и значение при передаче данных. Это может быть полезно для того, чтобы изменить каким-нибудь образом метод обработкии данных управляющим скриптом.
<input type=submit value=Отправить>
type=image
Предназначается для создания отправляющей кнопки в виде изображения. Очень полезно если вам не нравится кнопка создаваемая браузером. Атрибут name задает имя кнопки. Для указания URL изображения используется атрибут src, также можно использовать все атрибуты, которые имеет тэг изображений <IMG>. При отправке данных браузер отправляет также координаты точки на изображении, по которой был совершен щелчок мыши.
type=reset
Создает кнопку, которая по назначению является противоположной Submit. Короче эта кнопка сбрасывает все значения в форме и устанавливает их по умолчанию или заданные при инициализации,т.е. атрибутами value.
type=file
Это поле предназначается для вставки в отправляемые данные содержимого файла, имя которого пользователь набирает в текстовом поле. Современные, а тем более графические браузеры отображают рядом с текстовым полем кнопку, при нажатии на которую можно выбрать файл в интерактивном режиме. Для управления шириной и максимальной длинной текста используются атрибуты size и maxlength, также как в type=text.
<input type=file name=userfile size=40 maxlength=300>
type=hidden
Эта штука используется для отправки данных шлюзам, которые не отбражаются на странице и их значения пользователь задать не может. Почти всегда используется для хранения служебной информации. Обазательно должны содержать атрибуты name и value
<input type=hidden name=color value=black">
2. Элемент Select.
Создает меню, из которого можно выбрать один или несколько элементов. Элемент select должен иметь закрывающий тэг. Внутри него размещаются элементы option, которые задают значения пунктов меню. Меню имеющие возможность выбора нескольких элементов отображается в виде списка, при выборе только одного элемента меню отображается в виде выпадающего. Имеет следующие атрибуты.
name
Указавает имя меню, которые будет использоваться при передаче. В принципе все аналогично предыдущим элементам.
size
Этот атрибут устанавливает высоту меню в строках, если оно имеет возможность выбора нескольких элементов.
multiple
Присутствие этого атрибута указывает на возможность выбора нескольких элементо меню.
Атрибуты элемента option
selected
Указывает на то, что этот элемент меню инициализируется как выделенный при загрузке документа.
value
Указывает значение, которое будет передано обработчику формы вместе с атрибутом name, указанного в тэге select.
Элемент option может не иметь закрывающего тэга.
Пример:
<select name=color>
<option value=red selected> Красный
<option value=green> Зеленый
<option value=blue> Синий
</select>
3. Элемент TEXTAREA
Создает текстовое поле в форме. Если элемент имеет закрывающий тэг, то все что заключено между тэгами считается инициализирующим содержимым, т.е. имеет такое же значение, как и атрибут value у предыдущих элементов. Этот элемент может иметь следующие атрибуты:
name
Аналогично предыдущим элементам.
rows
Устанавливает высоту видимого размер поля для ввода текста. Задается в виде количества видимых строк текста.
cols
Устанавливает количество видимых сиволов в строке.
Если введенный текст не помещается в область выделенную для ввода, то браузер должен обеспечить прокрутку содержимого.
<textarea name=text cols=60 rows=15>
Введите Ваши комментарии
</textarea>
А теперь создадим форму для отправки сообщения - анкету о Вашем сайте, который посетил пользователь. Разумеется закрывающий тэг </form> обязателен.
<form action="mailto:mrharut@narod.ru?SUBJECT=From site" enctype=text/plain method=POST>
<input type=hidden name=" " value="Сообщение, отправленное с моего сайта">
<p>Была ли информация данного сайта полезной (интересной):
<select name="Полезность информации: ">
<option value="Да" selected> Да</option>
<option value="Нет"> Нет</option>
</select>
<p>Ваша оценка дизайна сайта:
<select name="Оценка дизайна: ">
<option value="Отлично" selected>Отлично</option>
<option value="Хорошо">Хорошо</option>
<option value="Удовлетворительно">Удовлетворительно</option>
<option value="Плохо">Плохо</option>
</select>
<p>Навигация сайта:
<select name="Навигация сайта: ">
<option value="Отличная" selected>Отличная</option>
<option value="Хорошая">Хорошая</option>
<option value="Удовлетворительная">Удовлетворительная</option>
<option value="Плохая">Плохая</option>
</select>
<p>Дополнительно: (до 300 знаков):
<textarea name="Дополнительно" cols="30" rows="10">
</textarea>
<p>
<input type=Submit value="Отправить" name="Submit">
<input type="reset" value="Очистить форму" name="reset">
</form>
[ Skype ] [ Профиль ] [ Mods Pack ] [ VK ] [ Геймеры ]
Помогаю новичкам, по всем вопросом комне в Skype/VK. VK ВЗЛОМАН, НЕ РАБОТАЙТЕ СОМНОЙ. МНЕ ВСЁ ВЗЛОМАЛИ СКАЙП И ВК. СКАЙП ВОССТОНОВИЛ.
|
|
|
|
|
| [WS]Grenhelgets |
Дата: Понедельник, 01.12.2014, 17:45 | Сообщение # 2
|
|
|
Добавь в скайп nicelse.ws предложение есть.
|
|
|
|
|
| GlaroX |
Дата: Четверг, 24.11.2016, 03:04 | Сообщение # 3
|
Боец
Сообщений: 201
Статус: Offline
|
Отличный разбор немного изучаю!
 
|
|
|
|
|
