Отправка и получение данных с веб-страницы
Для создания разделаЗаказать нам потребуются новые знания. Поэтому сейчас оставим наш проект ненадолго, вернемся к нему позже.
Для изучения нового материала добавим к нашему проекту файлtest.php. Это временный файл. Его нужно поместить в папку, где находится файл index.php (см. рис. 11.7).
Рис. 11.7
Очистим этот файл.Запишем стандартные HTML-теги для формирования страницы:
<html>
<body>
</body>
</html>
Достаточно часто пользователю сайта нужно отправить данные(например, если пользователь регистрируется на сайте).
Для этих целей в HTML предназначен специальный тег form, между его открывающим и закрывающим тегом размещается форма для отправки данных. Добавим тег на созданную страницу:
<html>
<body>
<form action="test.php" method="post" target="_self">
</form>
</body>
</html>
У тега formимеются различные атрибуты, три из которых являются основными:
Атрибут action –адрес страницы,которая получит отправленные данные. Это может быть любая страница, в том числе и на другом сайте. Мы указали текущую страницуtest.php –это значит, что страница сама сможет обработать данные формы.
Атрибут method –метод отправки данных getили post. С методом getмы уже подробно знакомились в нашем проекте.Данные формы рекомендуется отправлять методом post,который является более безопасным и рекомендованным для отправки данных.
Атрибут target –вариант открытия страницы, которой передаются данные: _self–страница открывается в этом же окне браузера, _blank –страница открывается в новом окне/закладке браузера.
Внутри формы нужно разместить теги, с помощью которых пользователь сможет ввести и отправить данные. Основным тегом является тег input. В зависимости от атрибута type, этот тег может принимать различный вид и свойства. Добавим два тега input:
<html>
<body>
<form action="test.php" method="post" target="_self">
<input type="text" maxlength="15" name="user_name" />
<input type="submit" value="Заказать звонок"name="btn"/>
</form>
</body>
</html>
Мы добавили два тегаinput- текстовое поле и кнопку для отправки данных.
Если type="text" –это текстовое поле,если type="submit" –это кнопка для отправки данных формы. Тегinput является одновременно открывающим и закрывающим.Для текстового поля желательно указать максимальное количество символов в атрибуте maxlength,для кнопки нужно указать ее наименование в атрибуте value.
Важно!!!Тег input может использовать атрибут type=”button” – это кнопка, которая внешне ни чем не отличается от кнопки type=”submit”. В отличие от button, кнопка submit предназначена именно для отправки данных формы. Кнопка submit внутри формы должна быть одна! Кнопок button может быть несколько.
Важный атрибут для тегаinput,расположенного внутри тега form –атрибут name. По значению атрибута name будет происходить обработка данных из PHP. Значение этого поля создается по правилам именования переменных.
Важно!!!На веб-странице может быть расположено несколько форм для отправки данных с тегом form, у каждой формы должна быть одна кнопка с типом submit.
Сохраним изменения в проекте и перейдем в браузер. Откроем отдельную закладку. В адресной строке введем http://puh/test.phpи нажмем клавишу Enter. В результате появится поле для ввода и кнопка (см. рис.11.8):
Рис. 11.8
При нажатии на кнопку,данные будут передаваться на страницу,указанную в атрибуте actionтега form.
<formaction="test.php" method="post" target="_self">
Рассмотрим организацию получения данных на веб-странице. С получением данных мы уже работали, когда получали данные от клиентской части наJava. Отличие в типе передачи данных. Получение данныхPOST-запроса происходит по аналогии с данными GET-запроса через служебный массив $_POST.
В самом верху страницыtest.php, над тегами, добавим PHP-вставку:
<?php
// Если передан параметрbtn через POST-запрос
if ($_POST["btn"])
{
// Получаем значение параметра"user_name"
// и удаляем пробелы слева и справа
$str = trim($_POST["user_name"]);
// Выводим значение на страницу
echo $str;
}
?>
Этот PHP-кодбудет выполняться при каждой загрузке страницы. В нем будет происходить проверка, что через POST-запрос передается параметр с именемbtn. Обратите внимание –имена параметров в точности совпадают со значением атрибута name в тегах input. Параметр указывается внутри квадратных скобок массива: $_POST["btn"], $_POST["user_name"].
Далее получаем значение текстового поля, срезаем пробелы функциейtrim():
$str = trim($_POST["user_name"]);
После этого значение выводится на экран. Посмотрим в браузере,введем в текстовое поле Hello!!!и нажмем кнопку – переданное значение появляется сверху (см. рис.11.9):
Рис. 11.9
По рассмотренной схеме можно получать данные от пользователя на текущей странице. Полученные данные можно записывать в базу данных или производить другие действия.