Форми і їх обробка, HTML, XML, DHTML, Інтернет-технології, статті

Activeserverpages.ru

Форми – це основний метод передачі інформації від користувача до сервера інформації через ASP. Форми на web містять теги які передаються до браузеру, який в свою чергу показує ці поля на екрані і дозволяє їх заповнювати. Більшість елементів сторінки (наприклад header, table, text і т.д.) передаються самим сервером. Поля введення передаються сервером браузеру у вигляді структури, і потім уже браузер приймає користувальницький введення і заповнює поля. Тепер сторінки, що містять форми можуть мати розширення. ASP і тоді браузер зможе повернути серверу інформацію, яка буде оброблена сервером як ASP і ваш код буде мати доступ до інформації, введеної користувачем.


HTML форми використовують тепер ASP (або ж будь-яка інша мова, підтримуваний web). ASP дозволить вам використовувати об’єкти, такі як теги опису форми, фіксовані об’єкти, об’єкти для користувача введення та об’єкти користувацького вибору.


Таги опису форми створюють форму і встановлюють умови того, як сервер повинен буде керувати інформаіцей, яку вводить користувач.
Фіксовані об’єкти це HTML-компоненти сторінки, такі як, наприклад title, graphics і т.д. Ці дані ніколи не міняються. Також користувач нічого не робить з цими елементами і вони повертаються незміненими на сервер.
Об’єкти для користувача введення це об’єкти типу рядка введення тексту, радіо-кнопок, або ж кнопок вибору. Ці об’єкти є найбільш основними компонентами форм. Вони зазвичай також називаються полями.


Для правильної обробки форм вам необхідно розібратися з двома основними методами передачі даних з форми до сервера. Отже існує два методи –
GET і POST.
Метод GET передає дані з полів форми в URL запиту. Тобто при натисканні кнопки Submit формується URL зі значеннями полів форми:


Приміром
russia.activeserverpages.com/SomeMyScript.asp?name=Marat&surname=Prazdnikow.


Даний приклад показує, як передаються параметри з форми – з рядка введення name і рядки surname. З прикладу видно, що параметри і значення форми передаються парами – параметр = значення і розділені символом &.
Для доступу до цих параметрів вам необхідно скористатися методом Request.Querystring (“параметр”).
Метод POST передає параметри і їх значення з форми в заголовку запиту, а не через URL. Для доступу до таких параметрами необхідно скористатися методом Request.Form (“параметр”).

Поле введення тексту

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


Форма завжди має наступний вигляд:
<FORM
Action=”MyResponse.asp”>
….. тут описуються всі поля форми (введення тексту, вибір, кнопи і т.д.)
</FORM>

У вікні браузера має вигляд:


Перша і остання рядки цього прикладу містять теги для створення форми –

І . Відкриває тег також містить один або кілька допонітельних параметрів, причому зліва стоїть назва параметра а праворуч через знак рівності присвоєно значення даного параметру. Параметр Action показує ім’я коду (у нашому випадку MyResponse.asp), який буде запущений, коли користувач натисне на кнопку Submit. Коли користувач натисне зазначену кнопку відбудеться 2 різних події. По-перше браузер передає дані з полів введення серверу, а по-друге сервер запустить код, зазначений вами в параметрі
Action.
Останній елемент створення форми – це створення кнопок типу Submit і Reset, що і буде продемонстровано нижче:
<FORM Action=”MyResponse.asp”>
… Тут описуються поля форми ….
<p><Input type=”submit”> <input
type=”reset”>
</FORM>


Тепер ми створили скелет форми, яка буде працювати правильно. Вам залишається тільки додати опис полів всередині форми.
Хочу звернути увагу на таги . В даному теге існують параметри, такі як type, value. Таг type описує тип елемента форми.


Рядок введення. Опис далі становить створення об’єкта користувацького введення, рядок введення тексту.


Текстове поле створюється досить просто:
<INPUT NAME=”field1″>
Даний тег створить рядок введення розміром заданим за умовчанням і браузер передає дані, введені користувачем серверу, причому значення передається під міткою
field1.


Ви можете також керувати розміром області введення тексту як показує приклад нижче:
<INPUT NAME=”field1″
SIZE=”5″>

Число прирівняна до параметру size показує, яка кількість символів буде виведено в область вводу. Це значення не є обмеженням на кількість символів. Тому цей параметр не можна використовувати як обмежувача введення користувача.


Ви можете управляти обмеженням символів, що вводять в такий чином:
<INPUT NAME=”field1″
MAXLENGHT=”40″>


Ви також можете вивести в форму значення за замовчуванням, яке користувач зможе або прийняти або змінити на власне.
<INPUT NAME=”feild1″ VALUE = “м.Москва”>
Назва міста бидет виведено як тільки форма відобразитися у вікні браузера. Деякі програмісти люблять виводити в текстові поля за замовчуванням значення-підказки типу “Введіть назву вашого міста “.


Нижче наведено приклад створення простої форми:


1 <html>
2 <head>
3 <body
bgcolor=”#FFFFFF”>
4 <FORM action=”MyResponse.asp”>
5 Це приклад по використанню форм!
6

Введіть сюди ваше ім’я:
7 <input
type=”text” name=”name”>
8 <input type=”submit”>
9
</form>


1 <hr>
2 <FORM
action=”MyResponse.asp”>
3 Це приклад на ту ж тему № 2
4

Введіть ваше ім’я:
5 <input name=”name” size=40>
6 <input
type=”submit”>
7 </FORM>
8 <hr>


1 <FORM action=”MyResponse.asp”>
2 Це приклад № 3
3 Будь ласка, введіть ваш поштовий індекс:
4 <input
name=”Index” MaxLength=”6″>
5 <input type=”submit”>
6
</FORM>


1 <FORM action=”MyResponse.asp”>
2 Це приклад форми № 4
3 Введіть назву вашого міста:
4 <input name=”name” value = “Москва”>
5 <input type=”submit”>
6
</FORM>


1 <FORM action=”MyResponse.asp”>
2 Це приклад № 5
3 Введіть сюди ваш індекс
4 <input name=”Index” MaxLenght=”6″ value = “Ваш індекс”>
5 <input type=”submit”>
6 </FORM>
7
<hr>
8
9 </body>
10 </html>

Поле CheckBox

Ви можете використовувати в своїх формах такий елемент, як CheckBox – незалежний елемент вибору з двома станами (обраний-не обрано).
Даний елемент має такий вигляд на сторінці:
Параметри з даного елемента передаються на сервер отделнимі для кожній CheckBox, і відповідно кожен цей елемент має своє унікальне ім’я. Також для цього елемента встановлюється значення в параметрі value яке вказує на його “обраного”.
Далі ми наводимо текст, що використовує даний елемент:


<FORM action=”MyResponse.asp”>

Яким чином ви хочете отримати інформацію від нас?
<p>
<input type=”checkbox” name = “post”> Поштою
<input type=”checkbox” name = “email”> E-mail’ом
<input type=”checkbox” name = “dhl”> Скористаюсь послугами DHL
<input type=”checkbox” name = “fax”> По факсу


Приклад тексту з використанням форм:


1 <html>
2 <head>
3
<body>
4
5 <FORM action=”MyResponse.asp” method=”post”>
6 Приклад № 1
7 Як ви будете отримувати від нас інформацію?
8 <p>
9 <input type=”checkbox” name = “post”> Поштою
10 <input type=”checkbox” name = “email”> E-mail’ом
11 <input type=”checkbox” name = “dhl”> Скористаюсь послугами DHL
12 <input type = “checkbox” name = “fax”> По факсу
13 <input
type=”submit”><input type=”reset”>
14 </FORM>
15
<hr>
16 </body>
17 </html>

Поле Радіо Кнопки

Всі ваші об’єкти для користувача введення в формі повинні мати свої власні імена (унікальні) які могли-б бути пізнані браузером і потім передані з цих компонент до сервера (ASP). Для групи кнопок визначається одне тільки ім’я, причому результатом вибору одного із значення є присвоєння імені групи кнопок значення, яке має вибраний елемент групи. Елемент – радіо-кнопки дуже схожий на справжній радіо кнопки. Натискаєш одну – віджимається інша.


Мова HTML вимагає, що-б один з варіантів вибору в даному елементі (поле) був спочатку вибраний. Досягається це параметром CHECKED. Він буде обраний при виведення форми в браузер.

Схожі статті:


Сподобалася стаття? Ви можете залишити відгук або підписатися на RSS , щоб автоматично отримувати інформацію про нові статтях.

Коментарів поки що немає.

Ваш отзыв

Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

*