Sdscompany.ru

Компьютерный журнал
0 просмотров
Рейтинг статьи
1 звезда2 звезды3 звезды4 звезды5 звезд
Загрузка...

Html form post

HTML формы

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

Синтаксически парный тег

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

С выходом HTML 5 к элементу добавилось 12 новых типов (видов) полей, но к сожалению, пока не все из них имеют полную поддержку всеми передовыми браузерами. Как вы понимаете, к самым часто используемым видам полей относятся те, которые были введены задолго до HTML 5, например, такие как:

  • checkbox (флаговая кнопка).
  • radio (радиокнопка).
  • submit (кнопкa отправки формы).
  • text (однострочное текстовое поле).

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

И так по порядку, что мы сделали в этом примере:

  • Разместили два однострочных текстовых поля ( ) для ввода пользователем своего имени и фамилии. Присвоили этим полям уникальные имена атрибутом name (для корректной передачи и обработки формы обязательно указывайте для каждого элемента этот атрибут). Кроме того атрибутом value установили для этих полей значения по умолчанию (при заполнении полей значение этого атрибута будет соответствовать пользовательскому вводу).
  • Разместили две радиокнопки ( ) для выбора одного из ограниченного числа вариантов. Обратите внимание, что для радиокнопок необходимо указывать одинаковое имя, чтобы была возможность выбрать только один вариант из предложенных. Для первой радиокнопки мы указали атрибут checked, который указывает, что элемент должен быть предварительно выбран при загрузке страницы (в данном случае поле со значением male ). Он применяется только для полей и , в противном случае он игнорируется.
  • Разместили пять флaговых кнопок (чекбоксов), которые позволяют пользователям указать необходимые параметры (выбрать необходимые значения). Присвоили этим полям уникальные имена атрибутом name и атрибутом value установили для этих полей необходимые значения.
  • Заключительный элемент, который мы разместили внутри формы это кнопка, которая служит для отправки формы ( ). У кнопки по аналогии с другими элементами имеется свое имя (атрибут name ) и значение (атрибут value ).

Результат нашего примера в браузере:

Рис 32 HTML формы.

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

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

Форма отправки данных в PHP (POST, GET)

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

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

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

* Для HTML5 так же существует возможность размещать теги полей формы не внутри тегов формы, а в любом месте на странице. При этом для каждого такого поля нужно указывать атрибут «form», чтобы определить с какой формой отправки он должен взаимодействовать.

Итак, простейшая форма отправки может содержать следующий код:

Элементы формы и их параметры:

action=»myform.php» – атрибут «action» определяет, какой php-файл будет обрабатывать отправляемые данные. В этом примере, данные будут отправлены в файл «myform.php», находящийся в той же директории что и страница с формой. Если этот атрибут не указать явно, данные формы будут отправлены по адресу страницы самой формы.

method=»post» – параметр method определяет метод передачи данных POST или GET. Более подробно об этом в статье «Отличия методов POST или GET». Если не указывать атрибут явно, по умолчанию будет использоваться метод GET.

Текст «Значение А:» и «Значение Б:» добавлен только с целью оформления и понятности формы для пользователя. Добавлять это для передачи данных не обязательно, но для того, чтобы пользователю стало понятно, что вводить, стоит указывать.

Читать еще:  Профиль пользователя html

Теги используются для формирования различных управляющих элементов формы.

type=»text» – атрибут «type» определяет вид поля. В зависимости от того, какой тип указан, меняется и внешний вид элемента, и его назначение. Значение атрибута «text» указывает, что в браузере элемент будет отображаться однострочным текстовым полем, куда пользователь сможет ввести свою строку.

name=»data1″ – атрибут «name», указывает имя, вернее индекс данных в массиве, полученных сервером. Это обязательный параметр, по которому в php-обработчике можно будет затем получить доступ переданному значению. Имя может быть выбрано произвольно, однако, удобнее когда это значение имеет какой-то понятный смысл.

type=»submit» – тег с таким значением параметра «type» будет отображаться на странице как кнопка. На самом деле на форме можно обойтись и без кнопки. Если, например, в форме есть текстовые поля, то отправку можно осуществить, просто нажав «Ввод» на клавиатуре. Но наличие кнопки делает форму более понятной.

value=»Отправить» – в данном случае (для type=»submit») определяет только надпись на кнопке. Для type=»text», например, это будет текст, который будет выведен в текстовом поле.

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

По нажатию на кнопку, будет выполнена отправка данных на указанную страницу, и если она существует и корректно работает, данные будут обработаны.

Обработка отправленных HTML формой данных в PHP

Отправленные описанным способом данные, помещаются в суперглобальные массивы $_POST, $_GET и $_REQUEST. $_POST или $_GET будут содержать данные в зависимости от того, каким методом осуществлялась отправка. $_REQUEST содержит отправленные данные любым из указанных методов.

$_POST, $_GET и $_REQUEST – это ассоциативные массивы, поля-индексы которых совпадают с атрибутами «name» тегов . Соответственно, для работы с данными в файле myform.php можно присвоить переменным значения элементов такого массива указав в качестве индекса имя поля:

// для метода GET
$a = $_GET[ ‘data1’ ];
$b = $_GET[ ‘data2’ ];

// для метода POST
$a = $_POST[ ‘data1’ ];
$b = $_POST[ ‘data2’ ];

// при любом методе
$a = $_REQUEST[ ‘data1’ ];
$b = $_REQUEST[ ‘data2’ ];

Проверка заполнения полей формы

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

if ( empty ($_REQUEST[ ‘data1’ ])) <
echo ‘Поле не заполнено’ ;
> else <
echo ‘Поле было заполнено’ ;
$a = $_REQUEST[ ‘data1’ ];
>

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

if ( isset ($_REQUEST[ ‘data1’ ])) <
echo ‘Поле было заполнено’ ;
$a = $_REQUEST[ ‘data1’ ];
> else <
echo ‘Поле не заполнено’ ;
>

Формы Html код для сайта с отправкой примеры

Форма для сайта html.Что из себя представляет форма Html для отправки , какие поля ввода существуют форме. Элементы формы Html. Примеры Html форм!

Сколько видов/типов форм существует!?

Всё о форме ввода Html

  1. Типы/виды формы, из чего состоит форма
  2. Код формы html
  3. Пример формы html -> без php
  4. Получить данные из формы html и отправить по почте
  5. Пример формы html -> с отправкой письма
  6. Первый вариант html формы
  7. Все формы html

    Код формы, элементы формы

    Я бы разделил все формы html на два типа это:

    1). Формы с textarea
    2). Формы без textarea, это может быть форма для регистрации , авторизации , вход в админку
    + 3). Сделаем каталог всех форм, а то как с регистрацией, был полный бардак!

    из чего состоит форма

    Код формы html

    Пример формы html

    Выкинули все старые стили, и написали их заново, это не ахти какая суперская форма, но старая вообще был полный отстой!

    1). Результат вывода на экран выше приведенной формы html:

    Напоминаю, именно эта форма, без php обработчика!

    Получить данные из формы html и отправить по почте

    Мы напишем малюсенький скрипт, который позволит вам понять, как должна работать форма отправки сообщений, почтовая форма — назовите как хотите!

    Для получения данных из формы html мы будем использовать метод post — это азы, поэтому с этого и начнем!
    1). В форме прописываем метод -> method=»post».
    2). У каждого поля ввода для нашего выбранного способа должен быть обязательный атрибут name , у нас, для нашей формы их будет 4, 3 поля + кнопка отправить:

    Соберем весь код вместе:

    вписываем свой емайл ‘; if(!$email_admin) < $BAD = 'Поле $email_admin не заполнено'; >
    $subject = ‘ вписываем тему — subject ‘;

    $message = ‘Пользователь ‘ .$name .’ с емайлом ‘ .$email .’ написал :
    ‘. strip_tags ($_POST[«message»]);

    $send = @mail($email_admin, $subject, $message);

    Пример формы html -> с отправкой письма

    Теперь, чтобы создать форму html с отправкой данных, нам нужно скрестить два предыдущих пункта и выделить эту форму в новую страницу!

    Первый вариант html формы

    Нарисуем простую почтовую форму, которую только можно придумать Мы уже сегодня говорили о методе post.

    Оттуда возьмем код добавим textarea плюс инпуты с type=number — это будет у нас самая простая цифровая капча!

    И для action — сделаем отдельную страницу, чтобы во всем там разобраться — здесь просто форма.

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

    Все формы html

    Столько развелось различных форм, что я сейчас и не знаю сколько всего их(форм) у меня на сайте! Это не есть хорошо.

    Исправим эту ситуацию, и разложим все наши html формы.

    1). Простая форма без php кодов

    Простая форма html, которая была написана самой первой вообще!

    HTML формы

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

    Синтаксически парный тег

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

    С выходом HTML 5 к элементу добавилось 12 новых типов (видов) полей, но к сожалению, пока не все из них имеют полную поддержку всеми передовыми браузерами. Как вы понимаете, к самым часто используемым видам полей относятся те, которые были введены задолго до HTML 5, например, такие как:

    • checkbox (флаговая кнопка).
    • radio (радиокнопка).
    • submit (кнопкa отправки формы).
    • text (однострочное текстовое поле).

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

    И так по порядку, что мы сделали в этом примере:

    • Разместили два однострочных текстовых поля ( ) для ввода пользователем своего имени и фамилии. Присвоили этим полям уникальные имена атрибутом name (для корректной передачи и обработки формы обязательно указывайте для каждого элемента этот атрибут). Кроме того атрибутом value установили для этих полей значения по умолчанию (при заполнении полей значение этого атрибута будет соответствовать пользовательскому вводу).
    • Разместили две радиокнопки ( ) для выбора одного из ограниченного числа вариантов. Обратите внимание, что для радиокнопок необходимо указывать одинаковое имя, чтобы была возможность выбрать только один вариант из предложенных. Для первой радиокнопки мы указали атрибут checked, который указывает, что элемент должен быть предварительно выбран при загрузке страницы (в данном случае поле со значением male ). Он применяется только для полей и , в противном случае он игнорируется.
    • Разместили пять флaговых кнопок (чекбоксов), которые позволяют пользователям указать необходимые параметры (выбрать необходимые значения). Присвоили этим полям уникальные имена атрибутом name и атрибутом value установили для этих полей необходимые значения.
    • Заключительный элемент, который мы разместили внутри формы это кнопка, которая служит для отправки формы ( ). У кнопки по аналогии с другими элементами имеется свое имя (атрибут name ) и значение (атрибут value ).

    Результат нашего примера в браузере:

    Рис 32 HTML формы.

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

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

    Простейшая форма отправки данных на почту при помощи HTML и PHP

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

    Язык разметки HTML сам по себе несложен, нужно всего лишь разобраться в том как и где ставить те или иные теги. С языком программирования PHP все немного сложнее.

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

    Создаем форму отправки данных в html

    На этом этапе нужно создать файл form.php, в него добавить html код формы. Подробности о каждом элементе формы читайте в статье Как сделать форму в HTML для сайта.

    Первая строка будет следующей

    Теперь соберем все вместе.

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

    Создаем файл, принимающий данные из HTML формы

    Это будет файл с именем send.php

    В файле на первом этапе нужно принять данные из пост массива. Для этого создаем две переменные:

    $fio = $_POST[‘fio’];
    $email = $_POST[’email’];

    Перед названиями переменных в php ставится знак $, в конце каждой строки ставиться точка с запятой. $_POST это массив в который передаются данный из формы. В форме html при этом указан метод отправки method=»post». Так, приняты две переменные из формы html. Для целей защиты своего сайта нужно провести эти переменные через несколько фильтров — функций php.

    Первая функция преобразует все символы, которые пользователь попытается добавить в форму:

    $fio = htmlspecialchars($fio);
    $email = htmlspecialchars($email);

    При этом новые переменные в php не создаются, а используются уже имеющиеся. Что сделает фильтр, он преобразует символ » $fio = urldecode($fio);
    $email = urldecode($email);

    Третей функцией мы удалим пробелы с начала и конца строки, если таковые имеются:

    $fio = trim($fio);
    $email = trim($email);

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

    Проверка данных, передаваемых от HTML формы в файл PHP

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

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

    Отправляем полученные данные из формы HTML на почту при помощи PHP

    Для отправки данных на почту нужно воспользоваться функцией mail в PHP.

    mail(«на какой адрес отправить», «тема письма», «Сообщение (тело письма)»,»From: с какого email отправляется письмо rn»);

    Например, нужно отправить данные на email владельца сайта или менеджера example@mail.ru.

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

    mail(«example@mail.ru», «Заявка с сайта», «ФИО:».$fio.». E-mail: «.$email ,»From: example2@mail.ru rn»);

    Необходимо добавить условие, которе проверит отправилась ли форма при помощи PHP на указанные адрес электронной почты.

    if (mail(«example@mail.ru», «Заказ с сайта», «ФИО:».$fio.». E-mail: «.$email ,»From: example2@mail.ru rn»))
    <
    echo «сообщение успешно отправлено»;
    > else <
    echo «при отправке сообщения возникли ошибки»;
    >

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

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

    Помещаем HTML и PHP код отправки формы в один файл

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

Ссылка на основную публикацию
Adblock
detector