Основы работы с XHTML и CSS


Локальная обработка данных


Основное назначение форм состоит в отправке введенных или выбранных данных на серверную страницу Web для обработки. Для этого предназначен атрибут action тега <form> - для определения страницы, на которую посылается информация.

Однако можно использовать элементы управления формы независимо от отправки формы, когда сценарии обработки данных являются сценариями браузера, расположенными на той же самой странице Web. В этом случае даже не требуется использовать на странице тег <form>.

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

Обработка введенных данных сценарием на странице

Рис. 11.2.  Обработка введенных данных сценарием на странице

Код элементов управления и сценарий обработки показаны ниже. Понимание сценария на данном этапе не требуется. Однако, отметим, что текстовое поле, кнопка, запускающая сценарий, и тег <span>, который служит в качестве получателя вывода сценария, не находятся внутри тега <form>. Тег <form> не требуется, так как введенная в текстовое поле информация не передается на сервер для обработки. Все элементы управления доступны непосредственно сценарию на странице.

<!-- Сценарий браузера -->

<script type="text/javascript"> function Get_Name() { var Input = document.getElementById("Name") var Output = document.getElementById("Output") Output.innerHTML = "Your name is <b>" + Input.value + "</b>." } </script>

<!-- Код XHTML --> <div> Enter your name: <input id="Name" type="text"/> <input type="button" value="Submit" onclick="Get_Name()"/><br/> <span id="Output" style="color:red"></span> </div>

Листинг 11.3. Код сценария на странице для обработки введенных данных (html, txt)

Если обработка элементов управления формы проводится исключительно сценариями браузера (форма не отправляется для обработки на сервере), то тег <form> не требуется. Однако, можно, включить тег <form action="">, чтобы указать на локальную обработку и для согласованности в кодировании элементов управления формы.




Начало  Назад  Вперед



Книжный магазин