Элементы web forms


Содержание

HTML: Формы

Атрибут name требуется большинству элементов формы, так как его значение передается на сервер и используется серверными сценариями.

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

type=»submit» Создает кнопку, при нажатии на которую браузер отправляет форму на сервер: Атрибут value задает текст, который будет отображен на кнопке, заменяя значение установленное по умолчанию. type=»radio» Создает элементы управления, позволяющие выбрать только один вариант из предложенных, то есть такие элементы управления являются взаимозаменяемыми. Они называются радио кнопками или переключателями: Попробовать »

Все радио кнопки, связанные с заданными вариантами значений, должны иметь одинаковое значение атрибута name, но каждая отдельная радио кнопка должна иметь уникальное значение атрибута value.

Примечание: элемент является строчным элементом, поэтому для отображения каждого элемента управления на новой строке нужно добавить после каждого элемента тег
или поместить каждый элемент в абзац (в тег

type=»checkbox» Создает элементы управления, позволяющие пользователям отмечать любое количество вариантов или отменить выбор, не выбрав ни одно из предложенных значений. Такие элементы управления называют флажками. Попробовать »

Все флажки, относящиеся к одной группе, должны иметь одинаковое значение атрибута name, но каждый отдельный вариант должен иметь уникальное значение атрибута value.

Примечание: все допустимые значения атрибута type смотрите в нашем HTML справочнике в описании элемента .

Элемент

создает многострочное текстовое поле. Если в поле введено больше текста, чем может поместится в текстовой области, то с правой стороны появляется полоса прокрутки. Текст, расположенный между открывающим и закрывающим тегом, будет отображаться в текстовом поле в качестве значения по умолчанию:

Атрибут name должен содержать уникальное имя, которое будет идентифицировать данный элемент на серверной стороне. Атрибут rows позволяет указать количество строк, определяющих высоту текстовой области, а cols задает ширину текстовой области в символах.

Выпадающий список

Элемент создает меню, содержащее выпадающий список. Элементы списка задаются с помощью элементов , которые должны располагаться между открывающим и закрывающим тегами элемента :

Элементы и

Для визуального выделения взаимосвязанных элементов формы можно воспользоваться элементом , который добавляет рамку вокруг своих дочерних элементов:

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

Элемент

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

По умолчанию метки визуально не отличаются от обычного текста, однако они позволяют выбирать элементы формы кликая не только на сам элемент, но и на его метку.

Связать метку с элементом формы можно двумя способами: поместить весь элемент формы внутрь элемента или с помощью атрибута for, который в качестве значения принимает идентификатор элемента формы, с которым нужно связать метку:

Метки можно размещать как до так и после элемента управления, связанного с ней, потому что, если значение атрибута for элемента совпадает со значением атрибута id элемента формы, то неважно где будет находиться метка.

Урок 5. Веб формы (web-формы)

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

В ранее выполненных уроках Вы освоили технологии, позволяющие предоставлять информацию посетителю веб-сайта. Но при разработке любой программы одна из главных задач, стоящих перед программистом, – это создание механизма взаимодействия с пользователем. Вам нужно научиться получать информацию от посетителя веб-сайта, а затем обрабатывать эту информацию. В HTML для получения данных посетителя предусмотрены веб формы и их элементы. В этом уроке Вы освоите технологию создания веб форм для сбора информации от посетителей.

После того, как посетитель заполняет предложенную ему форму (например, комментируя Ваш сайт или оформляя заказ в Вашем Internet-магазине), данные, введенные им в поля формы, отправляются серверной программе для последующей обработки.

1. Создание веб формы

Веб форма организуется с помощью тега и . HTML-документ может содержать в себе несколько форм, однако формы не следует вкладывать друг в друга.

  • action – обязательный атрибут, указывается URL, по которому следует передать введенную в форму информацию;
  • method – атрибут, указывающий каким образом (иначе говоря, с помощью какого метода протокола передачи гипертекстов) данные из формы будут переданы обработчику.

Задание 1

Откройте справочник Sprav_HTML.doc и ознакомьтесь с атрибутами тега и правилами их назначения. Законспектируйте материал.

2. Описание элементов веб формы

Существует три типа элементов формы: , , .

2.1. Элемент формы

Этот элемент служит для создания многострочного поля ввода (рис. 1).

Рис. 1. Пример использования элемента

У элемента имеются несколько атрибутов:

  • name – обязательный атрибут, определяющий имя, под которым содержимое поля будет передано обработчику;
  • rows – атрибут, устанавливающий высоту окна в строках;
  • cols – атрибут, устанавливающий ширину окна в символах.

. Внешний вид формы, содержащей элемент

, приведен на рис. 1.

Многострочные поля ввода можно использовать, например, для ввода комментариев посетителя.

Задание 2

  1. Реализуйте форму, изображенную на рис. 1.
  2. Сохраните файл в папке Lab_5 под именем forms.htm

2.2. Элемент формы

Этот элемент служит для организации разворачивающихся меню и полей списка (рис. 2).

Рис. 2. Пример раскрывающегося списка

У элемента имеются следующие атрибуты:

  • name – обязательный, определяющий имя переменной, которую генерирует меню;
  • multiple – устанавливает режим выбора нескольких значений из списка;
  • size – устанавливает число строк, отображаемых одновременно.

Между тегами и находятся значения, которые может выбирать пользователь. Они перечислены в теге . Тег – одиночный элемент, не требующий закрывающего тега.

Тег определяет элемент меню. У тега имеются следующие атрибуты:

  • value – обязательный, устанавливающий значение, которое будет передано обработчику, если выбран этот элемент меню;
  • selected – показывает, что данный элемент отображается выбранным.

HTML-код списка выглядит так (рисунок 3):

Внешний вид этой формы показан на рис. 2.

Задание 3

  1. В файле forms.html реализуйте код, предложенный выше. Выясните, как влияют на вид веб формы атрибуты size и multiple тега и атрибут selected тега .
  2. Сохраните файл.

2.3. Элемент формы


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

Задание 4

Откройте справочник Srav_html.doc и ознакомьтесь с атрибутами тега и правилами их назначения. Законспектируйте материал.

Основные типы элементов , определяемые атрибутом type:

Рис. 4. Пример использования элементов radio

Используется в тех случаях, когда необходимо выбрать только один из родственных элементов. Это значение атрибута type используется с атрибутами name (обязателен), value (определяет значение, возвращаемое серверу в случае выбора данной кнопки), checked (показывает, что кнопка выбрана по умолчанию). Присвоив одинаковые значения атрибуту name разных переключателей, их можно объединить в группу. В группе радиокнопок с одинаковыми именами может быть только одна помеченная радиокнопка. Пример:

В данном примере определена группа из трех радиокнопок, подписанных, соответственно: 9600 бит/с, 14400 бит/с и 28800 бит/с. Первоначально помечена первая из кнопок. Если пользователь не отметит другую кнопку, обработчику будет передана переменная modem со значением 9600. Если пользователь отметит другую кнопку, обработчику будет передана переменная modem со значением 14400 или 28800.

Задание 5

В файл forms.html добавьте веб форму, запрашивающую сведения о возрасте посетителя. Форма должна выглядеть как на рис. 4.

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

  • type=»checkbox» – кнопка с независимой фиксацией. Используется в тех случаях, когда одновременно можно выбрать несколько опций. Атрибуты: name(обязателен),value,checked (рис. 5).

Рис. 5. Пример использования элементов checkbox

Если на Ваш сайт зайдет пользователь, желающий купить проект, то, прежде чем оформить его заказ, следует уточнить, какие проекты его интересуют. Причем, возможно, он еще не решил, какой проект ему нужен, и готов рассмотреть несколько вариантов.

Чтобы решить эту задачу, нужно создать форму, использующую элементы checkbox, так как в этом случае, в отличие от использования элементов radio, можно выбрать несколько вариантов.

Задание 6

В файле forms.html создайте веб форму как на рис. 5.

  • type=»submit» – командная кнопка, которая отправляет на сервер все введенные данные. Данные отправляются по адресу, указанному в атрибуте action тега . Надпись на кнопке можно задать путем введения атрибута value=»Надпись», например:
  • type=»reset» – определяет кнопку, при нажатии на которую форма возвращается в исходное состояние. В этом случае данные обработчику не передаются, поэтому кнопка может и не иметь атрибута name. Надпись на кнопке задается при помощи атрибута value=»Надпись».

Задание 7

  1. В файле forms.html добавьте в конец каждой формы две кнопки: submit и reset с соответствующими надписями. Проверьте действие кнопки reset.
  2. По нажатию кнопки submit данные, введенные пользователем, отправляются соответствующей программе для обработки. Имя этой программы и путь к ней указываются в атрибуте action тега . Вы пока не умеете писать такие программы но, чтобы проверить работу кнопки submit, Вы можете в качестве значения атрибута action указать адрес любой Web-страницы или картинки.
  3. Сохраните созданную страницу. Результат для одной из веб форм на рис. 6

Рис. 6. Пример использования элементов submit и reset

  • type=»text» – определяет окно для ввода строки текста. Это значение атрибута type можно использовать с атрибутами name (обязателен), value, size и maxlength.

Если на Ваш сайт зайдет пользователь, желающий купить проект, то, прежде чем оформить его заказ, следует уточнить, каким образом Вы с ним будете связываться.

Чтобы решить эту задачу, нужно создать форму, позволяющую клиенту вводить контактную информацию о себе. При ее создании используются элементы text.

Задание 8

В файле forms.html создайте веб форму, которая выглядит как на рис. 7. Поля, обязательные для заполнения, отметьте звездочками.

Рис. 7. Пример использования элементов text

  • type=»password» ‑ определяет окно для ввода пароля. Абсолютно аналогичен типу text, только вместо символов вводимого текста показывает на экране звездочки (*).
  • type=»button» ‑ не выполняет никаких действий при нажатии на кнопку, если к ней не прикреплена программа. Это значение атрибута type используется с атрибутами name (имя кнопки), value (надпись на кнопке), onclick (для указания имени программы, которая будет выполняться при нажатии на эту кнопку).

Создание ссылки для отправки письма на электронный адрес

Вы можете создать ссылку на сайте таким образом, чтобы пользователь мог отправить письмо на Ваш электронный адрес. Например, при нажатии по ссылке «Написать письмо» (рис. 8), загрузится почтовая программа, и в строке «Кому» уже будет прописан адрес Вашей электронной почты, а в строке «Oт» будет электронный адрес пользователя, к которому подключена почтовая программа (рис. 9).

Рис. 8. Ссылка для отправки письма на электронный адрес

Рис. 9. Загрузка почтовой программы

Структура ссылки для отправки сообщений на электронный адрес выглядит следующим образом

1. Разработать для сайта проектов страницу zakaz.htm с формой, через которую будет осуществляться связь с посетителями сайта через веб форму (рис. 9). В раскрывающемся списке «Выберите категорию проекта» должны быть следующие пункты:

  • Проекты таунхаусов и блокированных домов,
  • Проекты домов на две семьи,
  • Проекты узких домов,
  • Проекты бань.

В раскрывающемся списке «Выберите материал» должны быть следующие пункты:

  • Проекты кирпичных домов,
  • Проекты домов из газобетона и пенобетона,
  • Проекты домов из бруса и бревна,
  • Проекты каркасных домов.

2. Создайте ссылку «Написать письмо» для отправки сообщений с сайта на Ваш электронный адрес (рис. 10)

Илон Маск рекомендует:  fread - Бинарно-безопасное чтение файла

3. Включите созданную страницу с веб формой в структуру сайта. Для этого в левом меню создайте пункт «Заказ проекта» и сделайте его гиперссылкой на страницу с формой заказа (рис. 11).

Рис. 10. Web-страница с формой заказа проекта

HTML Элементы формы

Глава описывает все элементы форм HTML.

Элемент

Самым важным элементом формы является элемент .

Элемент может быть отображен несколькими способами, в зависимости от атрибута type.

Все различные типы входных данных описаны в следующей главе.

Элемент

Элемент

Атрибут rows задает количество видимых строк в области текста.

Атрибут cols атрибут указывает видимая ширина текстовой области.

Вот как код HTML будет отображаться в браузере:

Элемент

Элемент определяет кликабельная кнопка:


Пример

Вот как код HTML будет отображаться в браузере:

Элементы формы HTML5

В HTML5 добавлены следующие элементы формы:

Примечание: Браузеры не отображают неизвестные элементы. Новые элементы, которые не поддерживаются в старых браузерах не будет «уничтожены » веб-странице.

Элемент HTML5

Элемент задает список предопределенного варианта элемент .

Пользователи будут видеть раскрывающийся список из предварительно заданных вариантов исходных данных.

Атрибут list в элементе , необходимо обратиться к атрибуту id в элементе .

Пример

Элемент HTML5

Цель элемента обеспечить безопасный способ для проверки подлинности пользователей.

Элемент задает два ключа генератора поля в форме.

Когда форма отправлена, генерируются два ключа, один открытый и другой закрытый.

Закрытый ключ хранится локально, а открытый ключ отправляется на сервер.

Открытый ключ может быть использован для генерации клиентских сертификатов для проверки подлинности пользователя в будущем.

Пример

Форма с шифровкой:

Элемент HTML5

Элемент представляет результат расчета (как выполняемый скрипт).

Пример

Выполнить расчет и показать результат в элементе :

HTML-форма и ее основные элементы

HTML — форма – это специальный модуль , предназначенный для ввода и последующей отправки на обработку каких — то данных , к примеру , логина и пароля , информации о пользователе , сообщения и т . д . Чаще всего используются следующие виды форм – регистрация , авторизация , отправка сообщения , отправка комментария , отправка письма на почту , анкета .

Вставка формы осуществляется напрямую в HTML — код страницы . Главный элемент формы называется form> . Уже внутрь него добавляются все остальные элементы – текстовые поля , « чекбоксы» , переключатели и т . д . У элемента form> имеется несколько атрибутов , один из которых является обязательным . Он называется action . В action указывается , где именно будет приниматься и обрабатываться информация , переданная посредством формы . Как правило , обработка происходит в стороннем PHP — файле . Пример использования атрибута – action =» obrabotchik . php «. Атрибут method позволяет задать метод передачи информации . По умолчанию ( если не прописывать атрибут ) будет указан метод GET . В данном случае информация передается напрямую через URL — адрес . Для каждого элемента формы будет создана пара следующего вида – « имя элемента = значение , которое в нем лежит ». Все эти пары , разделенные знаком « амперсанд » будут перечислены в адресной строке . Если прописать method =» POST » ( регистр не важен ), то данные будут передаваться не через URL , а через тело запроса ( в скрытом режиме ). В большинстве случаев используют именно POST . Пример создания формы:

Формы в HTML

В процессе навигации по сайтам пользователь, в основном, только щёлкает по ссылкам чтобы перемещаться по веб-страницам.

Но понятно, что пользователю иногда требуется обеспечить собственные поля ввода. Эти виды взаимодействия включают в себя:

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

Чтобы приспособиться к этим потребностям, HTML предлагает интерактивные элементы управления формы:

  • текстовые поля (для одной или нескольких строк);
  • переключатели;
  • флажки;
  • выпадающие списки;
  • виджеты для загрузки;
  • кнопки отправки.

Эти элементы управления задействуют разные теги HTML, но большинство из них использует тег . Поскольку это самозакрывающий элемент, тип поля определяется его атрибутом type :

Элемент

Также доступны и другие элементы форм, но мы рассмотрели наиболее используемые.

Создание веб-форм

На этой странице

После обновлений, внесенных в Dreamweaver Creative Cloud, поддержка HTML-элементов формы была расширена. См. сведения в разделе Расширенная поддержка элементов форм в HTML5.

О веб-формах

Когда посетитель вводит данные в форму, отображенную в веб-браузере, и нажимает кнопку «Отправить», эти данные отправляются на сервер, где обрабатываются серверным сценарием или приложением. Сервер отвечает, отправляя обработанные сведения обратно пользователю (или клиенту) или выполняя некоторые действия с содержимым формы.

Имеется возможность создавать формы для передачи данных на большинство серверов приложений, в том числе сервера PHP, ASP и ColdFusion. При использовании ColdFusion в формы можно также добавлять элементы управления, специфические для ColdFusion.

Данные формы также можно отправить непосредственно получателю электронной почты.

Объекты формы

В Dreamweaver элементы ввода данных в форме называются объектами формы. Объекты формы позволяют пользователю вводить данные. В форму можно добавить следующие объекты формы.

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

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

Содержат сведения, введенные пользователем, такие как имя, адрес электронной почты или настройки отображения, которые используются потом, когда пользователь посещает сайт в следующий раз.

При нажатии запускают выполнение действия. Можно добавить специальное имя или метку для кнопки или использовать одну из заранее определенных меток «Отправить» или «Сброс». Кнопку можно использовать для передачи данных формы на сервер или сброса значений формы. Также можно назначить другие задачи обработки, определенные в сценарии. Например, при нажатии кнопки может подсчитываться общая стоимость выбранных предметов на основании указанных значений.

Позволяют выбрать несколько вариантов в группе. Пользователь может выбрать любое число вариантов. В следующем примере показаны три установленных флажка: «Серфинг», «Катание на горном велосипеде» и «Рафтинг».

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

Меню со списком

Содержат значения параметра в списке с прокруткой, из которых можно выбрать несколько вариантов. При выборе варианта «Список» в меню отображаются значения параметра, из которых можно выбрать только один элемент. Используйте меню при ограниченном пространстве, когда необходимо отобразить много элементов или контролировать значения, возвращаемые на сервер. В отличие от текстовых полей, в которые можно ввести любой текст, включая некорректные данные, здесь определяются конкретные значения меню.

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

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

Позволяют находить файл на компьютере и загружать его в виде данных формы.

Позволяют вставить изображение в форму. Поля изображения можно использовать для создания графических кнопок, таких как «Отправить» или «Сброс». Чтобы использовать изображение для задачи, отличной от передачи данных, нужно добавить к объекту формы поведение сервера.

Создание HTML-формы

(Только для пользователей Creative Cloud): в рамках поддержки HTML5 на панели «Свойства» для элементов формы были добавлены новые атрибуты. Кроме того, четыре новых элемента формы (адрес электронной почты, поиск, телефон, URL-адрес) были добавлены в раздел «Формы» панели «Вставка». См. дополнительные сведения в разделе Расширенная поддержка элементов форм в HTML5.

В представлении «Дизайн» формы обозначены красным пунктирным контуром. Если этот контур не отображается, выберите меню «Просмотр» > «Вспомогательные элементы» > «Невидимые элементы».

Свойства HTML-формы отображаются в инспекторе свойств («Окно» > «Свойства»):

а. Чтобы выбрать форму, щелкните контур формы в окне документа.


б. В поле «Имя формы» введите уникальное имя, по которому можно будет идентифицировать форму.

Присвоив форме имя, вы сможете ссылаться на нее или контролировать ее, используя язык сценариев, например JavaScript или VBScript. Если не присвоить форме имя, Dreamweaver автоматически генерирует имя, используя синтаксис formn, увеличивая значение n для каждой добавляемой на страницу формы.

в. В поле «Действие» укажите страницу или сценарий, в котором будут обрабатываться данные формы, указав путь или щелкнув значок папки, чтобы перейти на нужную страницу или в нужный сценарий. Пример: processorder.php.

г. Во всплывающем меню «Метод» укажите метод передачи данных формы на сервер.

Задайте любой из следующих параметров.

По умолчанию — для отправки данных формы на сервер будет использована настройка браузера по умолчанию. Как правило, значение по умолчанию — метод GET.

GET — добавляет значение в URL-адрес, запрашивающий страницу.

POST — вставляет данные формы в HTTP-запрос.

Не используйте метод GET для отправки длинных форм. Длина URL-адреса ограничена 8192 символами. Если объем отправленных данных слишком велик, данные будут обрезаны, что приведет к неожиданным результатам или сбою обработки.

Динамические страницы, созданные параметрами, которые передаются методом GET, можно пометить закладками, потому что все значения, необходимые для повторного создания страницы, содержатся в URL-адресе, отображаемом в поле «Адрес» браузера. А динамические страницы, созданные параметрами, которые передаются методом POST, пометить закладкой невозможно.

При сборе имен пользователей и паролей, номеров кредитных карт или других конфиденциальных сведений метод POST является более безопасным, чем метод GET. Однако данные, передаваемые методом POST, не шифруются и могут быть легко перехвачены хакерами. Для защиты данных используйте безопасное подключение к безопасному серверу.

д. Во всплывающем меню «Тип шифрования» укажите MIME-тип кодировки данных, которые отправляются на сервер для обработки (необязательно).

Параметр по умолчанию application/x-www-form-urlencode обычно используется вместе с методом POST. При создании поля для загрузки файла укажите тип MIME multipart/form-data.

е. Во всплывающем меню «Назначение» укажите окно, в котором нужно отображать данные, которые возвращаются вызываемой программой (необязательно).

Если названное окно не открыто, открывается новое окно с этим именем. Задайте любое из следующих значений целевого объекта.

_blank — открывает целевой документ в новом неименованном окне.

_parent — открывает целевой документ в родительском окне окна, в котором отображается текущий документ.

_self — открывает целевой документ в том же окне, где была отправлена форма.

_top — открывает целевой документ в основной части текущего окна. Это значение можно использовать для того, чтобы целевой документ занимал все окно, даже если оригинал документа отображался во фрейме.

Отправка данных формы

На этой странице

В этой статье рассматривается, что происходит, когда пользователь отправляет форму — куда передаются данные и как мы их обрабатываем, когда они туда попадают? Мы также рассмотрим некоторые проблемы безопасности, связанные с отправкой данных формы.

Предварительные знания: Базовая компьютерная грамотность, понимание HTML и базовые знания по HTTP и программированию на стороне сервера.
Задача: Понять, что происходит при отправке данных формы, в том числе получить представление о том, как данные обрабатываются на стороне сервера.

Куда отправляются данные?

Здесь мы обсудим, что происходит с данными при отправке формы.

О клиенсткой/серверной архитектуре

WEB основан на очень простой клиент-серверной архитектуре, которую можно обобщить следующим образом: клиент (обычно веб-браузер) отправляет запрос на сервер (в основном веб-сервер, такой как Apache, Nginx, IIS, Tomcat, и т. д.), используя протокол HTTP. Сервер отвечает на запрос, используя тот же протокол.

На стороне клиента HTML-форма — это не более чем удобный способ настройки HTTP-запроса для отправки данных на сервер. Это позволяет пользователю предоставлять информацию для доставки в HTTP-запросе .

Заметка: Для получения более полного представления о том, как работают клиент-серверные архитектуры, ознакомьтесь с модулем «Первые шаги в программировании на стороне сервера».

На стороне клиента: определение способа отправки данных

Поскольку используется метод GET , вы увидите URL www.foo.com/?say=Hi&to=Mom , который появится в адресной строке браузера при отправке формы.

Данные добавляются в URL как последовательность пар имя / значение. После того, как URL веб-адрес закончился, мы добавляем знак вопроса ( ? ), за которым следуют пары имя / значение, каждая из которых разделена амперсандом ( & ). В этом случае мы передаем две части данных на сервер:

  • say , со значением Hi
  • to , со значением Mom

HTTP-запрос имеет следующий вид:

Заметка: Вы можете найти этот пример на GitHub — смотрите get-method.html (see it live also).

Метод POST

Метод POST немного отличается. Браузер использует этот метод для связи с сервером при запросе ответа с учётом данных, представленные в теле HTTP-запроса: «Эй, сервер, взгляни на эти данные и отправь мне соответствующий результат». Если форма отправляется с использованием этого метода, данные добавляются в тело HTTP-запроса.

Илон Маск рекомендует:  Интерактивная карта мира jquery плагин

Давайте рассмотрим пример — это та же самая форма, которую мы рассматривали в разделе GET выше, но с атрибутом method , установленным в post .

Когда форма отправляется с использованием метода POST , данные добавляются не к URL-адресу, а включаются в тело запроса. HTTP-запрос имеет следующий вид:

Заголовок Content-Length указывает размер тела, а заголовок Content-Type указывает тип данных, отправляемых на сервер. Мы обсудим эти заголовки позже.

Заметка: Вы можете найти этот пример на GitHub — смотрите post-method.html (see it live also).

Просмотр HTTP-запросов

HTTP-запросы никогда не отображаются пользователю (если вы хотите их видеть, Вам нужно использовать такие инструменты, как Firefox Network Monitor или Chrome Developer Tools). Например, данные формы можно увидеть на вкладке Сеть (Network) в Chrome следующим образом (после отправки формы):

  1. Нажмите F12
  2. Выберите Network
  3. Выберите «All»
  4. Выберите «foo.com» во вкладке «Name»
  5. Выберите «Headers»

Затем вы можете получить данные формы, как показано на рисунке ниже.

The only thing displayed to the user is the URL called. As we mentioned above, with a GET request the user will see the data in their URL bar, but with a POST request they won’t. This can be very important for two reasons:

  1. If you need to send a password (or any other sensitive piece of data), never use the GET method or you risk displaying it in the URL bar, which would be very insecure.
  2. If you need to send a large amount of data, the POST method is preferred because some browsers limit the sizes of URLs. In addition, many servers limit the length of URLs they accept.

On the server side: retrieving the data

Whichever HTTP method you choose, the server receives a string that will be parsed in order to get the data as a list of key/value pairs. The way you access this list depends on the development platform you use and on any specific frameworks you may be using with it. The technology you use also determines how duplicate keys are handled; often, the most recently received value for a given key is given priority.

Example: Raw PHP

PHP offers some global objects to access the data. Assuming you’ve used the POST method, the following example just takes the data and displays it to the user. Of course, what you do with the data is up to you. You might display it, store it into a database, send it by email, or process it in some other way.

This example displays a page with the data we sent. You can see this in action in our example php-example.html file — which contains the same example form as we saw before, with a method of post and an action of php-example.php . When it is submitted, it sends the form data to php-example.php, which contains the PHP code seen in the above block. When this code is executed, the output in the browser is Hi Mom .

Note: This example won’t work when you load it into a browser locally — browsers cannnot interpret PHP code, so when the form is submitted the browser will just offer to download the PHP file for you. To get it to work, you need to run the example through a PHP server of some kind. Good options for local PHP testing are MAMP (Mac and Windows) and AMPPS (Mac, Windows, Linux).

Example: Python

This example shows how you would use Python to do the same thing — display the submitted data on a web page. This uses the Flask framework for rendering the templates, handling the form data submission, etc (see python-example.py).

The two templates referenced in the above code are as follows:

  • form.html: The same form as we saw above in the The POST method section but with the action set to << url_for('hello') >> . (This is a Jinja2 template, which is basically HTML but can contain calls to the Python code that is running the web server contained in curly braces. url_for(‘hello’) is basically saying «redirect to /hello when the form is submitted».)
  • greeting.html: This template just contains a line that renders the two bits of data passed to it when it is rendered. This is done via the hello() function seen above, which runs when the /hello URL is navigated to.


Note: Again, this code won’t work if you just try to load it into a browser directly. Python works a bit differently to PHP — to run this code locally you’ll need to install Python/PIP, then install Flask using pip3 install flask . At this point you should be able to run the example using python3 python-example.py , then navigating to localhost:5000 in your browser.

Other languages and frameworks

There are many other server-side technologies you can use for form handling, including Perl, Java, .Net, Ruby, etc. Just pick the one you like best. That said, it’s worth noting that it’s very uncommon to use these technologies directly because this can be tricky. It’s more common to use one of the many nice frameworks that make handling forms easier, such as:

  • Django for Python (a bit more heavyweight than Flask, but with more tools and options)
  • Express for Node.js
  • Laravel for PHP
  • Ruby On Rails for Ruby
  • Phoenix for Elixir

It’s worth noting that even using these frameworks, working with forms isn’t necessarily easy. But it’s much easier than trying to write all the functionality yourself from scratch, and will save you a lot of time.

Note: It is beyond the scope of this article to teach you any server-side languages or frameworks. The links above will give you some help, should you wish to learn them.

A special case: sending files

Sending files with HTML forms is a special case. Files are binary data — or considered as such — whereas all other data is text data. Because HTTP is a text protocol, there are special requirements for handling binary data.

The enctype attribute

This attribute lets you specify the value of the Content-Type HTTP header included in the request generated when the form is submitted. This header is very important because it tells the server what kind of data is being sent. By default, its value is application/x-www-form-urlencoded . In human terms, this means: «This is form data that has been encoded into URL parameters.»

If you want to send files, you need to take three extra steps:

  • Set the method attribute to POST because file content can’t be put inside URL parameters.
  • Set the value of enctype to multipart/form-data because the data will be split into multiple parts, one for each file plus one for the text data included in the form body (if text is also entered into the form).
  • Include one or more File picker widgets to allow your users to select the file(s) that will be uploaded.

Note: Some browsers support the multiple attribute on the используется для создания интерактивных элементов управления в веб-формах для принятия данных от пользователя; в зависимости от устройства и user agent, доступен широкий выбор типов входных данных и виджетов управления.»> element, which allows more than one file to be chosen for uploading with only one element. How the server handles those files really depends on the technology used on the server. As mentioned previously, using a framework will make your life a lot easier.

Warning: Many servers are configured with a size limit for files and HTTP requests in order to prevent abuse. It’s important to check this limit with the server administrator before sending a file.

Common security concerns

Each time you send data to a server, you need to consider security. HTML forms are by far the most common attack vectors (places where attacks can occur) against servers. The problems never come from the HTML forms themselves — they come from how the server handles data.

Depending on what you’re doing, there are some very well-known security issues that you’ll come up against:

XSS and CSRF

Cross-Site Scripting (XSS) and Cross-Site Request Forgery (CSRF) are common types of attacks that occur when you display data sent by a user back to the user or to another user.

XSS lets attackers inject client-side script into Web pages viewed by other users. A cross-site scripting vulnerability may be used by attackers to bypass access controls such as the same origin policy. The effect of these attacks may range from a petty nuisance to a significant security risk.

CSRF attacks are similar to XSS attacks in that they start the same way — by injecting client-side script into Web pages — but their target is different. CSRF attackers try to escalate privileges to those of a higher-privileged user (such as a site administrator) to perform an action they shouldn’t be able to do (for example, sending data to an untrusted user).

XSS attacks exploit the trust a user has for a web site, while CSRF attacks exploit the trust a web site has for its users.

To prevent these attacks, you should always check the data a user sends to your server and (if you need to display it) try not to display HTML content as prov HTML Элемент

лабы по информатике, егэ

лабораторные работы и задачи по программированию и информатике, егэ по информатике

HTML Урок 7. Создание форм в html

Создание и работа с формами в html

Все элементы управления, коими являются текстовые поля, кнопки, флажки, выпадающие списки и т.п., как правило, размещаются внутри формы:

Атрибуты формы:

action (англ. «действие»)
Файл на сервере с кодом для отработки отосланных данных
action=»http://www.название.домен/имя программы»
enctype (англ. «тип кодировки») text/plain (обычный текст)
application/x-www-dorm-urlencoded (для метода Post отправки формы)
multipart/form-data (для метода Post, если прикрепляются файлы)
method (метод отправки данных) post
get
  • В атрибуте action указывается серверный файл со скриптом, ответственным за основную обработку данных, пересылаемых из формы. Обычно код этого файла пишется на серверном языке программирования, например, на языке php или perl.
  • Атрибут enctype указывает на тип передаваемой на сервер информации, если это просто текстовые данные — text/plain , если с формой отсылаются файлы, то следует указать multipart/form-data .
  • Атрибут method указывает и определяет форму передачи данных. Подробно мы на этом останавливаться не будем, однако следует сказать, что для более надежной передачи следует указать метод post .

Элементы формы html

  • Текстовое поле html:
  • Значение атрибута type — text — указывает на то, что это именно текстовое поле
  • size — размер текстового поля в символах
  • maxlength — максимальное кол-во вмещающихся в поле символов
  • value — первоначальный текст в текстовом поле
  • name — имя элемента, необходимо для обработки данных в файле-обработчике
  • Поле ввода пароля html:

    Вместо текста в поле отображается маска — звездочки или кружочки

    Кнопка submit html:

    Кнопка submit собирает все данные с формы, введенные пользователем и отправляет их по адресу, указанному в атрибуте action формы.

    Кнопка очистки формы html:

    Результат:

    Кнопка возвращает состояние всех элементов управления к первоначальному (очищает форму)

    Html флажок:

    ASP
    javascript
    PHP
    HTML

    В html флажок служит для организации множественного выбора, т.е. когда необходимо и возможно выбрать несколько вариантов ответа

    Атрибут checked устанавливает сразу элемент отмеченным

    Radio кнопка html:

    ASP
    Javascript
    PHP
    HTML

    radio кнопка html служит для единственного выбора из нескольких вариантов

    Атрибут checked устанавливает сразу элемент отмеченным

    Выпадающий список HTML

    Рассмотрим пример добавления выпадающего списка:

    • Выпадающий список состоит из главного тега — select — который имеет закрывающую пару, а каждый пункт списка — это тег option , внутри которого отображается текст пункта
    • Атрибут size со значением «1» указывает на то, что список в свернутом виде отображает один пункт, остальные открываются при щелчке на стрелочке меню
    • Атрибут selected у пункта ( option ) указывает на то, что именно этот пункт будет изначально виден, а остальные пункты «свернуты»


    Для больших и сложных списков есть возможность добавить подзаголовки — тег optgroup с атрибутом label (надпись):

    Для предоставления возможности выбора нескольких пунктов одновременно необходимо добавить атрибут multiple . Но в таком случае и атрибут size следует установить в значение, большее, чем 1 :

    Илон Маск рекомендует:  Вызов пользовательских функций

    Текстовая область в HTML

    Для ввода большого фрагмента текста служит элемент текстовая область:

    • Ширина элемента зависит от атрибута cols , который указывает сколько символов помещается по горизонтали
    • Атрибут rows определяет количество строк в элементе

    Другие элементы

    • Обычная кнопка

    Элемент кнопка-изображение

    Элемент загрузка файла

    Для прикрепления файла к форме существует специальный элемент управления:

    При его использовании значение кодировки формы (атрибут enctype у тега form ) должен иметь значение multipart/form-data

    Скрытое поле

    Важным элементом при программировании является скрытое поле. Поле не отображается в окне браузера, а призвано передавать дополнительные данные через форму в файл-обработчик.

    Дополнительные элементы и атрибуты

    • Для элементов управления radio и checkbox удобно использовать дополнительные элементы, которые, во-первых, делают привязку текста к самому элементу radio или checkbox, во-вторых, добавляют обводку при клике:

    В примере создана надпись (тег label ) для элемента checkbox . Привязка осуществляется через атрибут id , значение которого указано в атрибуте for надписи.

    Атрибут disabled позволяет блокировать элемент, делая его недоступным для изменения пользователем:

    Атрибут readonly делает текстовые документы доступными только для чтения (вносить и изменять текст нельзя):

    Для визуального оформления группы объектов можно использовать элемент fieldset :

    Книги HTML
    ASP
    javaScript

    Можно задать очередность передвижения по элементам клавишей TAB :

    Элемент будет первым в очереди переходов.

    Web-программирование. Обработка HTML-форм (стр. 1 из 8)

    Web-программирование. Обработка HTML — форм

    Подготовлена Прохоровым В.С.

    1. СОЗДАНИЕ HTML-ФОРМ

    1.1. Элементы форм

    1.2. Тег FORM — контейнер форм

    1.3. Тег INPUT и способы его использования

    1.3.1. Однострочные поля ввода

    1.3.2. Поле ввода пароля

    1.3.3. Скрытое текстовое поле

    1.3.4. Независимые переключатели

    1.3.5. Зависимые переключатели

    1.3.6. Загрузка файлов

    1.3.7. Кнопка отправки формы

    1.3.8. Кнопка сброса

    1.3.9. Кнопка отправки с индивидуальным рисунком

    1.4. Ввод многострочного текста. Тег TEXTAREA

    1.5. Списки выбора. Тег SELECT

    1.5.1. Списки с единственным выбором

    1.5.2. Списки множественного выбора.

    2. ПЕРЕДАЧА ДАННЫХ С ПОМОЩЬЮ ФОРМЫ

    2.1. Форма для передачи данных

    2.2. Трансляция полей формы

    2.3. Трансляция переменных окружения


    2.4. Работа с cookies

    2.4.1. Пример приложения с cookies

    2.5. Обработка списков с множественным выбором

    2.6. Обработка массивов

    2.7. Особенности обработки независимых переключателей

    2.8. Диагностика создаваемых массивов

    3. КАКОЙРЕЖИМВЫБРАТЬ: register_globals=off & on ?

    3.1. Первый пример уязвимости

    3.2. Второй пример уязвимости

    3.3. Порядок трансляции переменных

    4. ПРИЛОЖЕНИЯ, ХРАНЯЩИЕ ДАННЫЕ О РЕГИСТРАЦИИ ПОЛЬЗОВАТЕЛЕЙ В БАЗЕ ДАННЫХ MySQL

    5. ЗАДАНИЕ НА САМОСТОЯТЕЛЬНУЮ РАЗРАБОТКУ

    Одно из наиболее распространенных приложений любого языка создания серверных сценариев – обработка HTML — форм. Web-программирование в большей части представляет собой обработку различных данных, введенных пользователем.

    РНР облегчает задачу обработки и разбора форм, поступивших из браузера, так как в язык на самом нижнем уровне встроены все необходимые возможности. Поэтому программисту не приходится даже и задумываться над особенностями протокола HTTP и размышлять, как же происходит отправка и прием ро s т -форм или даже загрузка файлов.

    Работая с формами можно вводить текст в поле ввода, выбирать пункт меню, отмечать флажком правильный ответ, нажимать кнопку и т.д. При этом всегда ожидается от документа осмысленная реакция.

    Форма в HTML -документе реализуется тегом-контейнером FORM , в котором задаются все управляющие элементы — поля ввода, кнопки и т.д. Если управляющие элементы указаны вне содержимого тега FORM , то они не создают форму, а используются для построения пользовательского интерфейса на WEB -странице, то есть для привнесения в нее различных кнопок, флажков, полей ввода. Обработка таких элементов производится индивидуально в рамках самого HTML -документа с помощью включенных в него скриптов. А могут вообще никак не обрабатываться. Например, управляющий элемент TEXTAREA часто используется для создания окна с полосой прокрутки внутри документа для вывода большого текста, который играет второстепенную роль. Обычно так отображаются тексты лицензионных соглашений, тексты больших комментариев или правила пользования данным WEB -ресурсом. Имена элементам формы присваиваются через их атрибут NAME . Каждый элемент формы имеет начальное, используемое по умолчанию, и конечное значения, которые являются символьными строками. Начальные значения элементов не меняются, благодаря чему может осуществляться сброс значений, указанных пользователем. Результатом этого действия будет установка всех управляющих элементов формы в своих первоначальных используемых по умолчанию значениях.

    В HTML определены следующие типы управляющих элементов:

    Кнопки — задаются с помощью элементов BUTTON и INPUT . Различают:

    кнопки отправки — при нажатии на них отправляются формы серверу;

    кнопки сброса — при их нажатии устанавливают управляющие элементы в первоначальные значения;

    прочие кнопки — кнопки, для которых не указано действие, выполняемое по умолчанию при их нажатии.

    Зависимые переключатели (переключатели с зависимой фиксацией) — задаются элементом INPUT и представляют собой переключатели «вкл\выкл». Если несколько зависимых переключателей имеют одинаковые имена, то они являются взаимоисключающими. Это значит, что если одна из них ставится в положение «вкл», то все остальные автоматически — в положение «выкл». Именно это и является преимуществом их использования.

    Независимые переключатели (переключатели с независимой фиксацией) — задаются элементом INPUT и представляют собой переключатели «вкл\выкл», но в отличие от зависимых, независимые переключатели могут принимать и изменять свое значение независимо от остальных переключателей. Даже если последние имеют такое же имя.

    Меню — реализуется с помощью элементов SELECT, OPTGROUP и OPTION . Меню предоставляют список возможных вариантов выбора.

    Ввод текста — реализуется элементами INPUT , если вводится одна строка, и элементами TEXTAREA — если несколько строк. В обоих случаях введенный текст становится текущим значением управляющего элемента.

    Выбор файлов — позволяет вместе с формой отправлять выбранные файлы, реализуется HTML -элементом INPUT .

    Скрытые управляющие элементы — создаются управляющим элементом INPUT .

    Форма реализуется тегом-контейнером FORM . Тег своими атрибутами указывает адрес сценария, которому будет послана форма, способ пересылки и характеристику данных, содержащихся в форме. Начальный и конечный теги FORM задают границы формы. Их указание является обязательным.

    Атрибуты тега FORM :

    action — единственный обязательный атрибут. В качестве значения этого атрибута указывают URL -адрес запрашиваемой CGI -программы. Эта программа будет обрабатывать данные, содержащиеся в форме. Допустимо использовать запись MAILTO:URL , благодаря которой форма будет послана по электронной почте. Если атрибут ACTION все-таки не указан, то содержимое формы будет отправлено на URL -адрес, с которого загружалась данная WEB-страница.

    method — определяет метод HTTP , используемый для пересылки данных формы от браузера к серверу. Атрибут METHOD может принимать два значения: get или post .

    enctype — необязательный атрибут. Указывает тип содержимого формы, используемый для определения формата кодирования при ее пересылке. В HTML определены два возможных значения для атрибута ENCTYPE :

    ● APPLICATION/X-WWW-FORM-URLENCODED (используется по умолчанию).

    Тег INPUT позволяет создавать внутри формы поля ввода строки текста, имени файла, пароля и др. У INPUT нет конечного тега. Атрибуты и особенности использования INPUT зависят от способа его использования.

    Формат тега INPUT для создания поля ввода текстовой строки:

    Тег создает поле ввода с максимально допустимой длиной текста maxlen и размером в size знакомест. Если задан атрибут value , то в поле будет изначально отображаться указанная строка. В квадратных скобках помечены необязательные атрибуты.

    Пароль не должен отображаться на экране. Поле для ввода пароля:

    Вводимая информация в поле не отображается, а заменяется «звездочками».

    Не рекомендуется устанавливать значение value (значение по умолчанию) из соображений безопасности. В окне браузера данное значение не отображается, но стоит просмотреть исходный HTML -код, пароль будет виден «невооруженным глазом».

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

    Что такое веб-форма. Из чего она состоит и для чего нужна. Как и где её можно использовать

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

    Веб-форма на сайте – это аналог бумажной формы, анкеты, бланка и опросного листа.

    В формах имеются поля, предназначенные для заполнения, а также списки и переключатели, которые позволяют пользователю выбрать один или несколько элементов.

    Форму можно использовать для того чтобы получать сведения от посетителей сайта. К примеру, с помощью web-формы можно осуществлять сбор персональных данных, сведения о заказах, сведения, которые необходимы для выставления счета, способах доставки и так далее. От посетителей требуется внести различного рода информацию в поле формы.

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

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

    Форма может осуществлять свою работу только в том случае, если она поддерживается веб-сервером.

    Элементы формы, в которые можно ввести текст, называются полями формы. Поля формы могут уже содержать своё название («Обзор», «Сброс», «Отправить» и т.д.) или позволяют вводить текст.

    К примерам наиболее часто используемых html-форм можно отнести:

    Поля формы по своей сути являются текстовыми полями, переключателями, кнопками другими элементами. На выбор тех или иных элементов влияет информация, которую необходимо получить от посетителя.

    Текстовое поле применяется для того чтобы вводить текстовые строки. Максимальное число символов, которые возможно ввести в это поле, не зависит от его ширины.

    Флажки (checkbox) применяются для того, чтобы выбрать дополнительные элементы или услуги. Посетитель может самостоятельно снять флажок или установить его. С помощью флажков можно задавать возможность выбора сразу нескольких элементов. Стоит отметить, что флажки обладают только двумя значениями: «установлено» или же «сброшено».

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

    Текстовая область (textarea) применяется для того чтобы ввести одну или несколько строк текста. Данное поле прокручивается, что дает возможность ввода в него текстов различного объема.

    Текстовые области имеют широкие возможности применения (к примеру, с помощью них можно создавать гостевые книги).

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

    Раскрывающийся список можно настроить таким образом, чтобы допустить выбор одного значения или же нескольких. Очень часто такой список используется как выпадающее меню в навигации интернет-ресурса.

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

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

    При помощи кнопки можно изменить те или иные настройки. При этом возможно использование шрифтов, цветов и таблиц.

    С помощью окна группы можно обособить группу элементов или текст от другой информации, которая имеется на странице.

    У посетителей сайта может быть возможность отправки каких-либо файлов на сайт. Если в форме имеется поле под названием «передача файлов», пользователь может нажать на кнопку, которая называется «Обзор», выбрать нужный файл и отправить его.

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

    Далее необходимо задать правила валидации. Например: можно задать обязательные для заполнения поля формы или указать, что в определенные поля нужно вводить данные только определенного типа (например, только буквы или только цифры; ввод email-адреса; ввод url-адреса и т.д.).Правила валидации обеспечивают правильность заполнения формы посетителем сайта.

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

    Если пользователь заполнил веб-форму правильно, без ошибок, то после отправки данных на сервер, пользователю отображается страница успешного заполнения формы либо же происходит переадресация на заранее заданную страницу. Если же пользователь заполняет форму для опроса или голосования, то после успешного заполнения формы ему сразу же отображаются страница с общими результатами голосования.

    Подводя итоги можно сказать, что использование форм на сайте, как правило, предусматривает использование на сайте баз данных, их постоянной поддержке профессиональными программистами. Что в свою очередь увеличивает стоимость обслуживания сайта, а также накладывает ряд ограничений на выбор хостинг провайдера.

  • Понравилась статья? Поделиться с друзьями:
    Кодинг, CSS и SQL