TEXTAREA

Лекція 5

Форми та елементи діалогу

FORM

(HTML 2.0) – Form

Використовується для створення заповнюваної форми. Необхідна присутність початкового і кінцевого тегов. Усередині елементу FORMдозволяється використовувати більшість HTML-элементов.

Атрибуты:

NAME- визначає ім'я форми, унікальне для даного документа. Використовується, якщо в документі присутні декілька форм.

 

ACTION- обов'язковий атрибут. Визначає URL, по якому буде відправлено вміст форми - шлях до скрипту сервера, обслуговуючого дану форму.

METHOD- визначає спосіб відправки вмісту форми. Можливі значення GET (за умовчанням) і POST

ENCTYPE- визначає спосіб кодування вмісту форми при відправці. За умовчанням використовується "application/x-www-form-urlencoded".

TARGET- визначає ім'я вікна, в яке повертається результат обробки відправленої форми. Можливі значення : _self, _parent, _top, _blank або явно вказане ім'я вікна. Детальний опис значень дивитеся в атрибуті TARGET елементу A.

Приклад:

<!-- Создаем форму -->
<FORM ACTION="/cgi-bin/thanks.pl" METHOD=GET NAME="TestForm">

 

<!-- Внутри формы создаем поле ввода: -->
Фамилия:
<INPUT TYPE="text" name="lastname" SIZE="20" VALUE="Пупкин"><br>

 

<!-- Кнопка "Отправить": -->

<INPUT TYPE="submit" VALUE="Отправить">
</FORM>
<!-- Все, конец форме -->

Примітки:

1. Під час відладки скрипта, що приймає дані, найзручніше використовувати метод GET.

2. Метод GET не дозволяє передати скрипту великий об'єм даних. Якщо передбачається, що користувач заповнюватиме дуже велику форму або вводитиме об'ємні текстові дані, або пересилати файл - використовуйте METHOD="POST".

3. Перед тегом <FORM> в браузерах Netscape утворюється порожній простір, вертикальний відступ. Якщо вас це не владнує і при цьому форма на сторінці одна, помістите тег <FORM> в початок сторінки, відразу після тега <BODY>, це повинно допомогти.

TEXTAREA

(HTML 2.0) – Text Area

Створює поле для введення декількох рядків тексту. Зазвичай містить текст ініціалізації, який при завантаженні документа спочатку записуватиметься в дане поле. Елемент TEXTAREAповинен розташовуватися усередині елементу FORM

Атрибуты:

NAME- обов'язковий атрибут. Визначає назву, яка використовуватиметься при ідентифікації заполненого поля сервером.

ROWS- визначає кількість рядків тексту, видимих на екрані.

COLS- визначає ширину текстового поля - в друкарських символах.

WRAP- визначає спосіб перенесення слів в заповнюваній даній заповнюваній формі. Можливі значення:

Off- перенесення слів не відбувається (значення за умовчанням) virtual- перенесення слів лише відображується, на сервер же поступає неділимий рядок. physical - перенесення слів відбуватиметься в усіх точках перенесення.

 

Приклад:

<FORM ACTION="receive.html" METHOD=POST>
<TEXTAREA NAME="address" WRAP="virtual" COLS="40" ROWS="3">Ваш адрес...</TEXTAREA><br>
<INPUT TYPE="submit" VALUE="OK">
</FORM>

Результат:

 

 

Початок форми

Ваш адрес...

Кінець форми

Примітка:

Поле типа TEXTAREAдозволяє користувачеві набрати досить великий блок тексту. Тому, якщо у формі присутнє поле TEXTAREA, передавайте скрипту дані методом POST (див. елемент FORM) інакше є вірогідність втрати даних.

 

SELECT

(HTML 2.0) – Select

Елемент SELECTстворює в заповнюваній формі меню типа "Вибір одного пункту з багатьох" або "Вибір декількох пунктів з багатьох". Повинен розташовуватися усередині елементу FORM і мати як початковий, так і кінцевий теги. Містить декілька елементів OPTION, інакше не має сенсу.

Атрибути:

MULTIPLE- дає можливість вибору декількох пунктів меню при утриманні клавіші Ctrl. За умовчанням можна вибрати лише один пункт меню.

NAME- визначає ім'я меню, унікальне для даної форми, яке буде использоватся при передачі даних на сервер. Кожен вибраний пункт меню при передачі на сервер матиме вигляд: name/value. Значення (value) формується елементом OPTION.

SIZE- визначає кількість видимих пунктів в меню. Якщо значення цього атрибуту більше одиниці, то результатом буде список пунктів.

Приклад:

<FORM ACTION="receive.cgi">
<SELECT NAME="OS" MULTIPLE>
<OPTION VALUE="DOS">MS-DOS
<OPTION VALUE="WinXP">MS Windows98
<OPTION VALUE="Unix" SELECTED>UNIX
<OPTION VALUE="WinNT">MS Windows NT
</SELECT>
<INPUT TYPE="submit" VALUE="Послать">
</FORM>


Результат:

 

Початок форми

MS-DOS MS Windows98 UNIX MS Windows NT

Кінець форми

 

OPTION

(HTML 2.0) – Option

Використовується лише з елементом SELECT . Елемент OPTIONописує окремі пункти меню. Не має кінцевого тега.

Атрибути:

SELECTED- Визначає пункт меню, який буде вибраний спочатку при завантаженні документа. Якщо меню має типа "одного з багатьох", то прапором SELECTED може бути помічений лише один пунктів меню.

VALUE- Задає даному пункту значення, яке буде використано разом з іншими відомостями про вміст заповненої форми. При наданні інформації на сервер це значення буде об'єднано із значенням атрибуту NAME в елементі SELECT.

Приклад:

<FORM ACTION="script.cgi">
<SELECT NAME="gender">
<OPTION VALUE="male" SELECTED>Мужской
<OPTION VALUE="female">Женский
<OPTION VALUE="not_yet">Определяюсь
</SELECT>
<INPUT TYPE="submit" VALUE="OK">
</FORM>


Результат:

Початок форми

Мужской Женский Определяюсь

Кінець форми

 

INPUT

(HTML 2.0) – Input

Елемент INPUTстворює поле форми <http://html.manual.ru/book/html/body/forms.php> (кнопку, поле введення, чекбокс і тому подібне), вміст якого може бути змінений або активізований користувачем. Елемент не має кінцевого тега. Елемент INPUTповинен розташовуватися усередині елементу FORM.

Атрибути:

NAME- визначає ім'я, використовуване при передачі вмісту даної форми на сервер. Цей атрибут необхідний для більшості типів (атрибут TYPE - див. нижче) елементу INPUTі зазвичай використовується для ідентифікації поля або для групи полів, зв'язаних логічно.

TYPE- визначає тип поля для введення даних. За умовчанням - це "text". Можливі значення:

text- створює поле введення під один рядок тексту. Як правило використовується спільно з атрибутами SIZE і MAXLENGTH.
textarea- створює поле введення для тексту в декілька рядків. Але для цих цілей краще використовувати елемент TEXTAREA
file- дає можливість користувачеві залучити файл до поточної форми. Можливе використання спільно з атрибутом ACCEPT.
password- створює поле введення під один рядок, проте текст, що вводиться користувачем, відображується у вигляді значків "*", приховуючи тим самим його вміст від цікавих очей.
checkbox -створює поле введення для атрибутів типа Boolean ("так"/"ні") або для атрибутів, які можуть одночасно набувати декілька значень. Ці атрибути є декілька полів checkbox, які можуть мати однакові імена. Кожне вибране поле chackbox створює окрему пару name/value в інформації, що посилається на сервер, навіть якщо результатом будуть імена, що дублюються. Поле цього типа обов'язково повинне мати атрибути NAME і VALUE, а також необов'язковий атрибут CHECKED, який вказує на те, що поле активізоване.

radio- створює поле введення для атрибутів, які набувають одного значення з декількох можливих. Всі кнопки (radio buttons) в групі повинні мати однакові імена, але лише вибрана кнопка в групі створює пару name/value, яка буде послана на сервер. Як і для полів checkbox, атрибут CHECKED необов'язковий; він може бути використаний для визначення виділеної кнопки в групі кнопок (radio button).
submit- створює кнопку, при натисненні якої заповнена форма посилається на сервер. Атрибут VALUE в даному випадку змінює напис на кнопці, вміст якої, задане за умовчанням, залежить від браузеру. Якщо атрибут NAME вказаний, то при натисненні даної кнопки до інформації, що посилається на сервер, додається пара name/value, вказана для для атрибуту SUBMIT, інакше пара не додається.

image- створює графічну кнопку-картинку, що ініціалізувала передачу даних на сервер. Місцезнаходження графічного зображення можна задати за допомогою атрибуту SRC. При передачі даних серверу повідомляються координати xі втієї крапки на зображенні, де було вироблено клацання клавішею миші. Координати вимірюються з верхнього лівого кута зображення. При цьому інформація про поле типа image записується у вигляді двох пар значень name/value. Значення name виходить за допомогою додавання до назви відповідного поля суфіксів ".x" (абсциси), і ".y" (ординати).
reset- створює кнопку, що скидає значення полий форми до їх первинних значень. При натисненні кнопки дані на сервер не вирушають. Напис на кнопці може бути змінений за допомогою атрибуту VALUE. За умовчанням напис на кнопці залежить від версії браузеру.
hidden -поля цього типа не відображуються на екрані монітора, що дозволяє розмістити "секретну" інформацію в рамках форми. Вміст цього поля посилається на сервер у вигляді name/value разом з останньою інформацією форми. Цього типа полів зручно використовувати для передачі даних від скрипта скрипту непомітно для користувача.

button- дозволяє створити призначену для користувача кнопку в HTML документі, що, при умілому використанні 2-31679.php" class="back_link" > ⇐ Назад

  • 1
  • 2
  • 3
  • 45
  •