How to create a button and its event handler in PHP?
I am new to PHP but I need to create a button on a simple page and have its event handler. Any clue?
3 Answers 3
In the OnClick event of the button, insert JavaScript code that points to the PHP script which you want to run when the button is clicked.
PHP doesn’t work like .Net. So what you are talking about it actually not directly possible.
What you will need to do is create the raw markup for your form. At minimum a form tag and your button. Set the form’s action to a php script on your server, such as «button_action.php» and have it accept, via GET or POST, whatever data you wanted to send. (or if you are just talking about enacting some action, you don’t need to check anything)
Again, this isn’t .Net, so there is no postback, and you will not come back to the page. If you want to do that, you will have to redirect back from your other script.
Как сделать кнопку в php
В основном для передаче параметров из форс используются методы POST и GET. Главное отличие методов POST и GET заключается в способе передачи информации. В методе GET параметры передаются через адресную строку (URL), т.е. в HTTP-заголовке запроса, в то время как в методе POST параметры передаются через тело HTTP-запроса и никак не отражаются в адресной строке.
1. Кнопки — Тег <BUTTON>
Тег <BUTTON> создает на веб-странице кнопки и по своему действию напоминает результат, получаемый с помощью тега <INPUT> (с параметром type=»button | reset | submit»). В отличие от этого тега, <BUTTON> предлагает расширенные возможности по созданию кнопок. Например, на подобной кнопке можно размещать любые элементы HTML, в том числе изображения. Используя стили можно определить вид кнопки путем изменения шрифта, цвета фона, размеров и других параметров.
Теоретически, тег <BUTTON> должен располагаться внутри формы, устанавливаемой элементом <FORM>. Тем не менее, браузеры не выводят сообщение об ошибке и корректно работают с тегом <BUTTON>, если он встречается самостоятельно. Однако, если необходимо результат нажатия на кнопку отправить на сервер, помещать <BUTTON> в контейнер <FORM> обязательно. Закрывающий тег </BUTTON> обязателен.
• disabled — блокирует доступ и изменение элемента.
• type — тип кнопки
• value — Значение кнопки, которое будет отправлено на сервер или прочитано с помощью сприптов.
Параметр DISABLED Блокирует доступ и изменение кнопки. Она в таком случае отображается серой и недоступной для активации пользователем. Кроме того, такая кнопка не может получить фокус путем нажатия на клавишу Tab, мышью или другим способом. Тем не менее, такое состояние кнопки можно изменять через скрипты.
Параметр TYPE Определяет тип кнопки, который устанавливает ее поведение в форме. По внешнему виду кнопки разного типа никак не различаются, но у каждой такой кнопки свои функции. Значение по умолчанию: button.
button — Обычная кнопка.
reset — Кнопка для очистки введенных данных формы и возвращения значений в первоначальное состояние.
Submit — Кнопка для отправки данных формы на сервер.
Параметр VALUE Определяет значение кнопки, которое будет отправлено на сервер. На сервер отправляется пара «имя=значение», где имя задается параметром name тега <BUTTON>, а значение — параметром value. Значение может, как совпадать с текстом на кнопке, так быть и самостоятельным. Также параметр value применяется для доступа к данным через скрипты.
1.1. Кнопка (input type=button)
1.2. Кнопка с изображением (input type=image)
Кнопки с изображениями аналогичны по действию кнопке Submit, но представляют собой рисунок. Для этого задаем type=image и src=»image.gif».
Когда пользователь щелкнет где-нибудь на изображении, соответствующая форма будет передана на сервер с двумя дополнительными переменными — sub_x и sub_y. Они содержат координаты нажатия пользователя на изображение. Опытные программисты могут заметить, что на самом деле имена переменных, отправленных браузером, содержат точку, а не подчеркивание, но PHP автоматически конвертирует точку в подчеркивание.
1.3. Кнопка отправки формы (input type=submit)
Служит для отправки формы сценарию. При создании кнопки для отправки формы необходимо указать 2 атрибута: type=»submit» и value=»Текст кнопки». Атрибут name необходим, если кнопка не одна, а несколько и все они созданы для разных операций, например кнопки «Сохранить», «Удалить», «Редактировать» и т.д. После нажатия на кнопку сценарию передается строка имя=текст кнопки.
РНР-сценарий не требуется.
1.4. Массив кнопок (submit) для выбора варианта действий
2. Кнопка сброса формы (Reset)
При нажатии на кнопку сброса (reset), все элементы формы будут установлены в то состояние, которое было задано в атрибутах по умолчанию, причем отправка формы не производиться.
РНР-сценарий не требуется.
3. Флажок (checkbox)
Флажки checkbox предлагают пользователю ряд вариантов, и разрешает произвольный выбор (ни одного, одного или нескольких из них).
4. Переключатель(radio)
Переключатели radio предлагают пользователю ряд вариантов, но разрешает выбрать только один из них.
5. Текстовое поле (text)
При создании обычного текстового поля размером size и максимальной допустимой длины maxlength символов, атрибут type принимает значение text. Если указан параметр value, то поле будет отображать указанный в переменной value. При создании поля не забывайте указывать имя поля, т.к. этот атрибут является обязательным.
6. Поле для ввода пароля (password)
Полностью аналогичен текстовому полю, за исключением того, что символы, набираемые пользователем, не будут отображаться на экране.
7. Скрытое текстовое поле (hidden)
Позволяет передавать сценарию какую то служебную информацию, не отображая её на странице.
8. Выпадающий список (select)
Тэг <select> представляет собой выпадающий или раскрытый список, при этом одновременно могут быть выбраны одна или несколько строк. Но будет передано значение последней выбранной кнопке.
Список начинается с парных тегов <select></select>. Теги <option></option> позволяют определить содержимое списка, а параметр value определяет значение строки. Если в теге <option> указан параметр selected, то строка будет изначально выбранной. Параметр size задает, сколько строк будет занимать список. Если size равен 1, то список будет выпадающим. Если указан атрибут multiple, то разрешено выбирать несколько элементов из списка. Но эта схема практически не используется, а при size = 1 не имеет смысла.
Если необходимо создать выпадающий с предсказуемой последовательностью. Например, список с годами с 2000 по 2050. То используется следующий прием.
9. Многострочное поле ввода текста (textarea)
Многострочное поле ввода текста позволяет отправлять не одну строку, а сразу несколько. При необходимости можно указать атрибут readonly, который запрещает редактировать, удалять и изменять текст, т.е. текст будет предназначен только для чтения. Если необходимо чтобы текст был изначально отображен в многострочном поле ввода, то его необходимо поместить между тэгами <textarea></textarea>.
Существует параметр wrap – задание переноса строк. Возможные значения:
off — отключает перенос строк;
virtuals — показывает переносы строк, но отправляет текст как он введен;
physical — переносы строк оставляются в исходном виде.
По умолчанию тег <textarea> создает пустое поле шириной в 20 символов и состоящее из 2 строк.
Для того, чтобы в многострочном текстовом поле соблюдалось html-форматирование (перенос строк по средством тега <br> или <br \>), то используйте функцию nl2br():
10. Кнопка для загрузки файлов (browse)
Служит для реализации загрузки файлов на сервер. При создании текстового поля также необходимо указать тип поля type как «file».
СПОСОБЫ ОБЩЕНИЯ БРАУЗЕРА С СЕРВЕРОМ
Способов, предоставляемых протоколом HTTP, немного. Это важная информация. Никаких других способов нет. На практике используются два: GET — это когда данные передаются в адресной строке, например, когда пользователь жмет ссылку. POST — когда он нажимает кнопку в форме.
Метод GET
Чтобы передать данные методом GET не надо создавать на HTML-странице форму (использовать формы для запросов методом GET вам никто не запрещает — но это тупость) — достаточно ссылки на документ с добавлением строки запроса которая может выглядеть как переменная=значение пары объединяются с помощью амперсанда & а к URL страницы строка присоединяется с помощью вопросительного знака «?».
Но можно не использовать пары ключ=значение если надо передать всего одну переменную для этого надо после знака вопроса написать ЗНАЧЕНИЕ (не имя) переменной.
Преимущество передачи параметров таким способом заключается в том что клиенты которые не могут использовать метод POST (например, поисковые машины) все же смогут просто пройдя по ссылке передать параметры скрипту и получить содержимое.
Недостаток в том, что просто изменив параметры в адресной строке пользователь может повернуть ход сценария непредсказуемым образом, это создает огромную дыру в безопасности в сочетании с неопределенными переменными и register_globals on или кто-нибудь может узнать значение важной переменной (например ID-сеcсии) просто посмотрев на экран монитора.
Для чего следует использовать:
— для доступа к общедоступным страницам с передачей параметров (повышение функциональности)
— передача информации не влияющей на уровень безопасности
Для чего не следует использовать:
— для доступа к защищенным страницам с передачей параметров
— для передачи информации влияющей на уровень безопасности
— для передачи информации не подлежащей модифицированию пользователем (некоторые передают текст SQL-запросов.
Метод POST
Передать данные методом POST можно только с помощью формы на HTML странице. Основное отличие POST от GET в том, что данные передаются не в заголовке запроса а в теле, следовательно пользователь их не видит. Модифицировать может только изменив саму форму.
Преимущество:
— большая безопасность и функциональность запросов с помощью форм методом POST.
Для чего следует использовать:
— для передачи большого объема информации (текст, файлы..);
— для передачи любой важной информации;
— для ограничения доступа (например, использовать для навигации только форму — возможность доступная не всем программам-роботам или грабберам-контента).
Для чего не следует использовать:
Загрузка файлов методом POST
PHP способен принимать файл, загружаемый при помощи любого браузера,. Это дает возможность загружать как текстовые, так и бинарные файлы. Вместе с PHP-аутентификацией и функциями для работы с файловой системой вы получаете полный контроль над тем, кому разрешено загружать файлы, и над тем, что делать с файлом после его загрузки.
Страница для загрузки файлов может быть реализована при помощи специальной формы, которая выглядит примерно так:
В приведенном выше примере «_URL_» необходимо заменить ссылкой на PHP-скрипт. Скрытое поле MAX_FILE_SIZE (значение необходимо указывать в байтах) должно предшествовать полю для выбора файла, и его значение является максимально допустимым размером принимаемого файла. Также следует убедиться, что в атрибутах формы вы указали enctype=»multipart/form-data», в противном случае загрузка файлов на сервер выполняться не будет.
Внимание
Опция MAX_FILE_SIZE является рекомендацией браузеру, даже если бы PHP также проверял это условие. Обойти это ограничение на стороне браузера достаточно просто, следовательно, вы не должны полагаться на то, что все файлы большего размера будут блокированы при помощи этой возможности. Тем не менее, ограничение PHP касательно максимального размера обойти невозможно. Вы в любом случае должны добавлять переменную формы MAX_FILE_SIZE, так как она предотвращает тревожное ожидание пользователей при передаче огромных файлов, только для того, чтобы узнать, что файл слишком большой и передача фактически не состоялась.
Как определить метод запроса?
вернет GET или POST.
Какой способ следует применять?
• Если форма служит для запроса некой информации, например — при поиске, то ее следует отправлять методом GET. Чтобы можно было обновлять страницу, можно было поставить закладку и или послать ссылку другу.
• Если же в результате отправки формы данные записываются или изменяются на сервере, то следует их отправлять методом POST, причем обязательно после обработки формы надо перенаправить браузер методом GET. Так же, POST может понадобиться, если на сервер надо передать большой объём данных (у GET он сильно ограничен), а так же, если не следует «светить» передаваемые данные в адресной строке (при вводе логина и пароля, например).
В любом случае, после обработки POST надо всегда перенаправить браузер на какую-нибудь страницу, пусть ту же самую, но уже без данных формы, чтобы при обновлении страницы они не записывались повторно.
Как передать данные в другой файл непосредственно из тела PHP-программы методом GET и POST?
Пример, для демонстрации отправки данных методом POST и GET одновременно и получения ответа от сервера. В этом примере файл file.php получил переменные:
GET var=»23″ и var2=»54″
POST var3=»test» и var4=»еще тест»
Внимание, данные передаваемые через POST или GET всегда передаются строкой (string), независимо от того, через форму они передаются или через скрипт. Поэтому передавая число, помните, что в скрипт оно попадет как string.
Как перейти на другую страницу сайта из тела программы?
На новую страницу На предыдущую с обновлением:
Через генерацию JavaScript-кода:
На предыдущую с обновлением: На предыдущую без обновления: Перезагрузить текущую страницу:
Через PHP-функцию:
На новую На предыдущую страницу с обновлением: На текущую страницу с обновлением и генерацией полного url-адреса:
Самое главное, что надо помнить: сервер по своей инициативе обратиться к клиенту не может. Мы можем только по факту запроса выдать что-то браузеру — либо страницу, либо команду запросить другой ресурс.
ПРИМЕРЫ НЕОБЫЧНОГО ИСПОЛЬЗОВАНИЯ ФОРМ
Эти примеры показывают, что PHP-программу обработки ввода можно отделить от HTML-текста можно расположить на одной странице.
Пример 1. Задание номера карточки.
Здесь отсутствует кнопка передачи данных, т.к. форма, состоящая из одного поля, передается автоматически при нажатии клавиши Enter.
Пример 2. Навигация по массиву (списку) по средством формы.
В этом примере осуществляется перемещение по списку (массиву) элементов с отражением его номера (ключа) и значения элемента в массиве с помощью кнопок и скрытой строки с передачей навигационного параметра.
ПРОВЕРКА КОРРЕКТНОСТИ ДАННЫХ ИЛИ ДОПУСТИМОСТИ ВВОДИМЫХ ДАННЫХ
На любом современном сайте используются всевозможные HTML-формы, которые пользователь должен заполнить и отправить данные на сервер. Это может быть гостевая книга, форум, форма обратной связи, подписка на рассылку и т.д.
Данные, вводимые пользователем в форму и отправляемые в файл-обработчик, необходимо проверять на корректность. Причем проверке корректности данных, вводимых пользователем необходимо уделять достаточно большое внимание, поскольку необработанные ошибки, возникающие при вводе неправильном вводе данных, приводят к ошибкам в работе скрипта, зачастую катастрофическим. Предположим, вы создаете форму для отправки пользователем письма, при этом адрес электронной почты необходимо вводить пользователю. В этом случае, для корректной работы программы вы должны сделать, по крайней мере, две вещи:
• Проверить, что поле, в которое заносится электронный адрес непустое (поскольку пользователь может просто забыть ввести адрес, и, если этот случай необработан, возникнет ошибочная ситуация);
• Проверить соответствие введенного адреса с помощью регулярного выражения.
Email обязательно должен содержать символ @, быть по длине не менее 8 символов, есть также регулярное выражение, по которому можно проверить данные на предмет соответствия адресу электронной почты.
Встает вопрос, как проинформировать пользователя о том, что он неправильно ввел данные? Один из вариантов решения этой проблемы — через сессионные переменные.
Пусть есть страница form.php, на которой расположена наша форма, и есть файл send.php, который является обработчиком данных формы в файле form.php.
В обоих файлах должна быть запущена сессия функцией session_start() в начале сценария до отправки заголовков документа.
Пусть отправляется переменная email методом POST в файле send.php, то делаем:
1. Проверку на длину:
2. Проверку корректности адреса электронной почты
Такая проверка осуществляется зачастую с помощью регулярных выражений. Как известно, у адреса две составляющие — имя пользователя и имя домена, которые разделены знаком @. В имени пользователя могут присутствовать заглавные и прописные буквы цифры, знаки подчеркивания и минуса, точки. Для проверки разделителя между именем пользователя и именем домена в выражение требуется добавить +@.
Также не забывайте, что электронный ящик может находиться на поддомене xxx@xxx.xxx.com, или даже на домене четвертого, пятого уровня (как вариант, реально эта ситуация крайне редка, но отбрасывать эти адреса не стоит). Поэтому в регулярном выражении не забывайте использовать точку (экранированную «\.«) для указания того, что часть адреса после «@» может содержать точку как разделитель доменных имен.
Таким образом, регулярное выражение, проверяющее имя пользователя и наличие разделителя имеет следующий вид:
Для проверки доменного имени первого уровня учитываем, что его длина уже составляет не только 2 символа (.ru) или 3 символа (.com), но и 4 символа — .info, и даже 6 символов. Поэтому добавляем такое выражение:
Объединяя эти шаги, получаем следующее регулярное выражение для проверки адресов электронной почты:
Проверка осуществляется по этому шаблону с применением функции preg_match():
Эта пользовательская функция check_email возвращает true, если переданное значение переменной $email соответствует шаблону и false в противном случае.
В итоге проверка на корректность будет выглядеть так:
Соответственно в файле form.php перед формой прописываем следующее:
Соответственно, если ошибка была, то она будет напечатана пользователю перед формой. Таким же методом можно сохранять данные в заполненных полях формы, чтобы пользователь по несколько раз не вводил одно и то же.
ДРУГИЕ ПРОВЕРКИ НА КОРРЕКТНОСТЬ ВВЕДЕННЫХ ДАННЫХ
Каждый web-мастер должен уметь не только писать скрипты, но и грамотно организовывать защиту своих творений. Одним из важнейших навыков является умение правильно фильтровать всю информацию, поступающую от пользователя.
Кроме чистых ошибок пользователя, необходимо также исключить ситуации, в которых возможно злонамеренное введение некорректных данных, к примеру, различных скриптов. Для этого вводимый пользователем текст необходимо обработать функциями удаления HTML-тегов (для исключения возможности написания скриптов на JavaScript и Visual Basic) и обратных слешей (для исключения возможности написания скриптов на Perl). Т. о. минимальный набор действий, необходимый для проверки корректности данных, вводимых пользователем, включает следующие этапы:
• проверка того, что пользователь ввел данные
• проверка допустимости вводимых пользователем данных (как правило, осуществляется при помощи регулярных выражений)
• обработка текста, введенного пользователем функцией htmlspecialchars для удаления HTML-тегов
• обработка текста, введенного пользователем функцией stripslashes для удаления обратных слешей
ФИЛЬТРАЦИЯ ДАННЫХ
Прежде всего, следует фильтровать данные, которые передает пользователь осознанно — в основном, это данные различных форм. Это может быть пара логин-пароль для входа, пункт голосования и т.п. Например, такая форма
После нажатия кнопки «OK» передаст скрипту index.php два значения — $login и $pass. Как их можно отфильтровать? Пример для переменной $login:
Вводимый пользователем текст необходимо обработать функциями удаления HTML-тегов (для исключения возможности написания скриптов на JavaScript и Visual Basic) и обратных слешей (для исключения возможности написания скриптов на Perl). К примеру, если переменная $login содержит текст с именем пользователя, то обработка этого текста выглядит так:
В первой строке мы проверяем существование переменной $login, если она существует — идем дальше, если нет — выводим сообщение об ошибке. Затем с помощью функции htmlspecialchars заменяем в этой переменной спецсимволы на их HTML-мнемоники. Функция stripslashes вырезает знак обратного слеша ‘\‘. Далее с помощью str_replace вырезаем знак прямого слеша, точку (иногда бывает полезно) и обратную кавычку.
Если вы знакомы с регулярными выражениями, то предыдущий пример можно записать гораздо короче:
Этот фрагмент кода будет проверять введенный логин на соответствие регулярному выражению ‘/[0-9a-z_]/i‘, которое означает: все цифры + все латинские буквы в любом регистре + знак подчеркивания. Если логин содержит другие символы, то будет показано сообщение об ошибке.
Аналогично фильтруются переменные, получаемые скриптом через URL. В движках сайтов можно встретить что-то вроде таких ссылок:
Если не фильтровать переменную $module (или $_GET[`module`], если register_globals отключен), то над сайтом могут вытворяться не очень хорошие вещи, вроде XSS. Нужно применять первый приведенный мной скрипт-чистильщик, разумеется, убрав сообщения об ошибках.
ПРОВЕРКА НА ПУСТОТУ ПОЛЯ
Проверка того, что пользователь ввел данные, может осуществляться, к примеру, с помощью функции isset: Для этой же цели можно использовать функцию empty:
На практике удобно сначала проверить, не пустой ли action формы, а потом уже проверять различные его составляющие: поле имя, e-mail и т. д. К примеру:
ТАБЛИЦА СРАВНЕНИЯ ТИПОВ В PHP
Следующая таблица демонстрируют работу PHP с типами переменных и операторами сравнения, как в случае свободного, так и в случае строгого сравнения. Также эта информация относится к разделу документации по приведению типов.
Замечание: HTML-формы не передают тип переменной: они всегда передают строки. Для проверки является ли строка числом, используйте функцию is_numeric().
Замечание: Использование if ($x) пока $x не определена сгенерирует ошибку E_NOTICE. Вместо этого используйте функцию empty() или isset() и/или инициализируйте переменную.
Полностью своя кнопка «Выбрать файл»
Предлагаю на суд сообщества свой велосипед. На написание данного текста вдохновил Способ №5 из материала Делаем красивый input[type=file] для адаптивного сайта… И да — все работает в IE, начиная с 9 версии.
Цель: создать свою кнопку/элемент управления по нажатию которой происходит загрузка файла на сервер (либо иные, предусмотренные разработчиком, файловые операции).
Инструменты: CSS, PHP, JavaScript.
Используемые технологии: Ajax, через скрытый iframe.
Преамбула
Из кода для упрощения сознательно выкинуты все процедуры проверки принятого файла и try-catch вызовов функций, так как эти моменты не являются темой данной статьи. Также не охватывается момент по предотвращению звукового сигнала в IE. В работе используем технологию Ajax, подразумевающую, что у нас есть основная страница, осуществляющая взаимодействие с пользователем(front-end) и скрипт на сервере, обрабатывающая наши запросы(back-end)
Технология работы
1. На главной странице создаем «form action» Делаем ей target на скрытый фрейм, который создаем статически (или динамически). Создаем два «input» с типом «file» и «submit», даем им «id», помещаем их в «div», который спрячем со страницы стилем. Все эти элементы не видимы для пользователя и не воспринимают каких-либо его действий.
2. Начинаем «магию». Для «input» с типом «file» на событие по изменению вешаем вызов функции onchange=«LoadFile();».
3. На главной странице создаем кнопку. Навешиваем ей на событие нажатия кнопки мыши вызов функции onclick=«FindFile();».
4. В функции FindFile() имитируем клик на «input» с типом «file». То есть при нажатии на нашу кнопку вызывается стандартный диалог выбора файла. Как только пользователь выбрал файл, срабатывает событие onchange и вызывается функция LoadFile(). В функции LoadFile() имитируем клик на «input» с типом «submit».
5. Форма формирует POST запрос с именем файла к нашему back-end скрипту, который осуществляет все проверки по безопасности и загрузку файла. После этого скрипт вызывает callback функцию главной страницы, которой сообщает о результате выполнения.
Собственно все. Для примера приведены четыре основных файла, код которых приведён ниже:
Как сделать кнопку в php
Получение и обработка данных, введённых пользователем, стали неотъемлемой частью большинства успешных Web-сайтов. Бесспорно, возможност накопления статистики, проведения опросов, хранения персональных настроек и поиска выводят Web на принципиально новый уровень — без них эта среда обладала бы минимальной интерактивностью.
Ввод информации в основном реализуется с применением форм HTML. Как правило, пользователь заполняет в форме одно или несколько полей (например, имя и адрес электронной почты), нажимает кнопку отправки данных, после чего получает ответное сообщение.
Возможно, Вы полагаете, что сбор пользовательских данных в форматах HTML — процесс сложный и утомительный. В действительности эта задача решается на удивление просто.
При вводе данных в форму используются различные управляющие элементы. В одних элементах пользователь вводит информацию с клавиатуры, в других он выбирает нужный вариант, щёлкая кнопкой мыши. В формах могут присутствовать скрытые поля, которые поддерживаются самой формой; содержимое скрытых полей не должно изменяться пользователем.
Одна страница может содержать несколько форм, поэтому необходимы средства, которые позволили бы отличить одну форму от другой. Более того,вы должны как-то сообщить форме, куда следует перейти, когда пользователь выполняет действие с формой (как правило, нажимает кнопку отправки данных). Обе задачи решаются заключением форм в следующие теги HTML.
<form action =»действие» method=»метод»></form>
Как видно из приведённого фрагмента, в тегах форм указывается два важных элемента: действие и метод. Действие указывает, какой сценарий должен обработать форму, а метод определяет способ передачи данных по этому сценарию. Существует два метода:
Текстовое поле
В текстовых полях обычно водится короткая текстовая информация — скажем, адрес электронной почты, почтовый адрес или имя. Синтаксис определения текстового поля:
<input type=»text» name=»имя переменной» size=»N» maxlenght=»N» value=»»>
Определение текстового поля включает пять атрибутов:
Особой разновидностью текстовых полей является поле для ввода паролей. Оно работает точно также, как обычное текстовое поле, однако вводимые символы заменяются звёздочками. Чтобы создать в форме поле для ввода паролей, достаточно указать
type=»password» вместо type=»text».
Введите следующий код HTML:
Сохраните файл под именем vvod_s_klaviatury.html, откройте его в браузере. Если Вы всё сделали правильно, Вы увидите в окне браузера страничку, приведённую на рисунке 2.1. Протестируйте текстовые поля при вводе разных имён и паролей.
Текстовая область (text area) используется для ввода небольших объемов текста, не ограничивающихся простым именем или адресом электронной почты, а например для ввода текстового сообщения.
Синтаксис определения текстовой области следующий:
<textarea name=«имя_переменной» rows=«N» cols=«N» value=«»></textarea>
Определение текстового поля включает три основных атрибута:
Введите следующий текст HTML:
Сохраните файл под именем text_oblast.html, откройте его в браузере. Если Вы всё сделали правильно, Вы увидите в окне браузера страничку, приведённую на рисунке 2.2, в которой к полям для ввода имени и пароля добавилось поле ввода сообщений.
В других элементах форм пользователь выбирает один из заранее определённых вариантов при помощи мыши. Ограничимся описанием флажков, переключателей и раскрывающихся списков.
Флажки (checkboxes) используются в ситуациях, когда пользователь выбирает один или несколько вариантов из готового набора — по аналогии с тем, как ставятся «галочки» в анкетах.
Синтаксис определения флажка:
<input type=»cheskbox» name=«имя_переменной» value=«начальное_значение»>
Определение флажка включает три атрибута:
Введите следующий текст HTML:
Сохраните файл под именем flagi.html, откройте его в браузере. Если Вы всё сделали правильно, Вы увидите в окне браузера страничку, приведённую на рисунке 2.3, в которой организован список из нескольких пунктов. Пользователь может отметить один, несколько, или даже все пункты флажками.
В данном случае для каждого пункта установлены разные значения атрибута Name=, но они могут быть и одинаковыми.
Переключатель (radio buton) представляет собой разновидность флажка; он работает практически так же за одним исключением — в любой момент времени в группе может быть установлен лишь один переключатель.
Синтаксис определения переключателя:
<input type=»radio» name=«имя_переменной» value=«начальное_значение»>
Как видите, синтаксис определения переключателя почти не отличается от синтаксиса определения флажка.
Определение переключателя поля включает три атрибута:
Введите следующий текст HTML:
Сохраните файл под именем switsh.html, откройте его в браузере. Вы увидите страничку, приведённую на рисунке 2.4, в которой организованы два переключателя.
Каждый из переключателей создается с помощью тега <input> c атрибутом type=»radio», однако в одну группу объединяются те переключатели, теги которых имеют одинаковые значения атрибута name=.
Раскрывающиеся списки особенно удобны в ситуации, когда у Вас имеется длинный перечень допустимых вариантов, из которых пользователь должен выбрать один вариант. Как правило, раскрывающиеся списки применяются при работе с относительно большими наборами данных — например, при перечислении областей или стран.
Синтаксис определения раскрывающегося списка:
<select name=«имя_переменной»>
<option value=«имя_переменной1»>
<option value=«имя_переменной2»>
"option value=«имя_переменной3»>
.
<option value=«имя_переменнойN»>
</select>
Определение раскрывающегося списка включает два атрибута:
Введите следующий текст HTML:
Сохраните файл под именем spiski.html, откройте его в браузере. Вы увидите страничку, приведённую на рисунке 2.5, в которой организованы два раскрывающихся списка.
Скрытые поля не отображаются в браузере и обычно используются для передачи данных между сценариями. Хотя передача в скрытых полях работает вполне нормально, в РНР существует другое, более удобное средство — сеансовые переменные, но об этом средстве Вы узнаете несколько позже. Впрочем скрытые поля также используются в некоторых ситуациях и потому заслуживают внимания.
Синтаксис определения стрытого поля gрактически индентичен синтаксису текстовых полей, отличается только атрибут поля. Поскольку текстовые поля не отображаются в браузере, привести пример на страниwах методического пособия невозможно.
Синтаксис определения скрытого поля:
<input type=»hidden» name=»имя_переменной» value=»начальное_значение»>
Определение скрытого поля включает три атрибута:
Вообще говоря, название этого элемента — скрытое поле — несколько неточно. Хотя скрытые поля не отображаются в браузерах, пользователь может просто выполнить команду View Source и увидеть, какие скрытые значения хранятся в форме.
Кнопка отправки формы инициирует действие, заданное атрибутом action тега <form>.
Синтаксис определения кнопки отправки формы:
<input type=»submit» value=»текст на кнопке»>
Определение кнопки включает два атрибута:
Кнопка сброса отменяет все изменения, внесённые в элемент формы.
Синтаксис определения кнопки сброса:
<input type=»reset» value=»текст на кнопке»>
Определение кнопки сброса включает два атрибута:
Кнопка сброса выглядит точно также, как и кнопка отправки данных, если не считать того, что на ней обычно выводится слово Reset.
Формы HTML должны содержать следующие элементы:
В HTML-коде первая строка для формы будет выглядеть примерно так:
<form method=»post» action=»yorscript.php»>
Когда Вы щёлкните мышью на кнопке для пересылки HTML-формы, переменные будут посланы вашей программе, указанной в параметре action=, с помощью метода, указанного в параметре method=.
Метод может быть один из двух: или «post» или «get». Переменные, передаваемые из формы в сценарий РНР, помещаются в глобальный ассоциативный массив $http_post_vars или $http_get_vars в зависимости от метода, указанного в форме. Они автоматически становятся доступными для Вашей программы.
В следующем параграфе этого методического пособия Вы создадите HTML-форму и связанный с ней сценарий РHP, выполняющий вычисления в соответствии с полученными из формы данными.
В этом параграфе Вы создадите форму для сценария калькулятора. Эта форма будет содержать два поля ввода и переключатели для выбора типа расчёта.
Введите следующий текст HTML:
Чтобы начать создание формы с методом post и действием, выполняющимся в сценарии calculate.php, введите заголовок формы:
Чтобы создать поля ввода с надписью для двух переменных, введите:
Чтобы создать кнопку «Вычислить», введите текст
Чтобы закрыть форму, и завершить HTML-код введите текст:
Сохраните созданный файл под именем calculate_form.html в папке для документов Вашего Web-сервера. Запустите браузер, в строку Адрес: введите: http://localhost/calculate_form.html и нажмите Enter. В браузер отобразится страница calculate_form.html (pис. 2.6)
В окне браузера находится форма, содержащая поля ввода Значение 1 и Значение 2 и кнопку Вычислить. Остановитесь на минутку, чтобы посмотреть на HTML-форму и понять, какие имена будут иметь переменные, значения которых вводятся через форму.
Выберите в браузере команду меню Вид/В виде HTML, чтобы переключить режим отображения вашего браузера для просмотра исходного HTML-кода. На экране появится рабочее окно текстового редактора Блокнот с исходным текстом отображенной браузером страницы (рис. 2.7).
При пересылке формы в ваш сценарий будут переданы две переменные — $val1 и $val2, так как именно эти имена являются значениями параметра NAME, использованного при создании каждого текстового поля. Значениями этих переменных будут значения, введенные пользователем в соответствующие поля формы.
Теперь добавим к уже созданной форме переключатели, состояние которых будет определять тип операции над двумя значениями: сложения, вычитания, умножения и деления.
http://localhost/calculate_form.html
и нажмите клавишу Enter.
Если Вы все сделали правильно, то в рабочем окне браузера появится страница calculate_form.html с группой переключателей Действиe: (рис. 2.8).
Теперь созданная нами форма содержит два поля ввода Значение 1 и Значение 2, переключатель Действие и кнопку Вычислить. Кроме того, к уже существующим двум переменным ($vall и $val2) добавилась еще одна с именем $calc, которая также будет посылаться в ваш сценарий.
Теперь вся предварительная подготовка выполнена, и в следующем параграфе Вы создадите сценарий калькулятора.
В соответствии с выбранным в форме calculate_form.html действием, необходимо назвать PHP-сценарий calculate.php. Цель сценария — принять два значения переменных $val1 и $val2 и произвести с ними вычисления в зависимости от значения переменной $calc.
Это выражение как бы говорит: «Если любая из переменных не имеет значения, то нужно выполнить блок программы, распо-ложенный сразу после оператора if«.
//здесь будет находиться блок программы,
на две следующих строки:
header («location: http://localhost/calculate_form.html»);
exit;
Первая из этих двух строк выводит строку заголовка — в данном случае он указывает на адрес ресурса (URL), к которому надо выполнить переход. Во второй строке осуществляется выход из программы сценария. Эти две строки вместе означают, что если любая из переменных не имеет значения, то пользователь будет направлен назад к файлу, содержащему форму.
Удостоверьтесь, что перед началом PHP-блока нет пустых строк, пробелов или другого текста. Вы не можете использовать функцию header (), если что-то уже было отправлено браузеру.
Мы создали все, что нужно для калькулятора: внешний вид (форму) и внутреннее содержание (сценарий), теперь можно приступить к его проверке. Запустите ваш Web-браузер, в поле Адрес: введите:
http://localhost/calculate_form.html
и нажмите клавишу Enter, в рабочем окне браузера появится страница с формой (рис. 2.10).
Нажмите кнопку Вычислить, не вводя ничего в поля ввода формы. Web-браузер перезагрузит страницу, потому что вы не ввели значения в три требуемых поля.
Теперь, после проверки работы сценария на присутствие необходимых данных, попробуйте выполнить несколько вычислений для проверки правильности работы программы.
В рабочем окне браузера появится страница с результатом вычитания двух чисел (рис. 2.12).
Рис. 2.12. Результат проверки действия вычитания двух чисел.
Результат умножениядвух чисел показан на рис. 2.13.
Рис. 2.13. Результат проверки действия умножения двух чисел.
Вы проверили все возможные вычисления с различными значениями переменных. Как видите, калькулятор вполне работо-способен, он может даже выполнять операции с отрицательными и дробными числами. Убедитесь в этом сами, только помните, что в дробных числах целая часть должна отделяться от дробной части точкой, а не запятой.
Переменные окружения HTTP
Когда Web-браузер выполняет запрос к Web-серверу, он вместе с запросом посылает еще дополнительный список перемен-ных. Эти переменные называются переменными окружения и могут использоваться для отображения динамического содержимого или авторизации пользователей.
Функция phpinfo () выводит большое количество информации о программном обеспечении Web-сервера, версии РНР, который вы запустили, и об основных переменных окружения HTTP. Чтобы посмотреть эту информацию, выполните следующие действия:
http://localhost/phpinfo.php
и нажмите клавишу Enter. В рабочем окне браузера появится очень длинная страница, полная информации (рис. 2.15).
Информация, выводимая функцией phpinfо (), будет различной не только на разных компьютерах, но и при использовании разных операционных систем. На Рис. 2.15 показана информация, полученная при использовании операционной системы Windows.
Чтобы посмотреть переменные окружения, прокрутите страницу вниз с помощью вертикальной полосы прокрутки и найдите раздел Apache Environment (Окружение) (pис. 2.16).
В следующем параграфе вы узнаете, как использовать две переменные окружения REMOTE_ADDR и HTTP_USER_AGENT.
Получение и использование значения переменной REMOTE_ADDR
По умолчанию переменные окружения доступны сценариям РНР как $имя_переменной. Например, к переменной окружения REMOTE_ADDR можно обратиться по имени $REMOTE_ADDR. Однако, чтобы быть абсолютно уверенным, что вы читаете правильное значение переменной, используйте функцию getenv (), чтобы присвоить значение выбранной вами переменной.
Переменная окружения REMOTE_ADDR содержит IP-адрес компьютера, выполняющего запрос. Чтобы получить значение переменной окружения REMOTE_ADDR, выполните следующие действия:
http://localhost/remoteaddress.php
и нажмите клавишу Enter. В рабочем окне браузера появится информация о IP-адресе вашего компьютера (Рис. 2.17).
Ваш IP-адрес в зависимости от настроек вашего Web-сервера и операционной системы компьютера может отличаться от показанного на рис. 2.17.
Получение и использование значения переменной HTTP_USER_AGENT
Переменная окружения HTTP_USER_AGENT содержит тип и версию браузера, кодировку языка и тип операционной системы. Например, строка Mozilla/4.61 — (Win98;l) означает, что используется браузер Netscape (Mozilla), версии 4.61, язык английский, операционная система Windows 98. Могут быть и другие значения переменной HTTP_USER_AGENT. Например, при использовании Microsoft Internet Explorer (MSIE) версии 5.0 с операционной системой Windows 98, значение переменной HTTP_USER_AGENT может иметь тип браузеpa Netscape с примечанием compatible (совместимый) и указанием конкретного браузера, как показано в приведенной ниже строке:
Mozilla/4.0 (compatible; MSIE 5.0; Windows 98)
He забудьте еще о текстовых браузерах. В операционной системе Linux значение переменной HTTP_USER_AGENT может выглядеть так:
Lynx/2.8rel.3 libwww-FM/2.14
Чтобы найти и вывести на экран переменную HTTP_USER_AGENT, выполните следующие действия:
http://localhost/useragent.php
и нажмите клавишу Enter. В рабочем окне браузера появится информация о типе браузера и операционной системе вашего компьютера (рис. 2.18).
В следующей части вы узнаете много основных задач Web-разработчиков, включая отображение динамического содержимого, отправку электронной почты (E-mail) и работу с файловой системой вашего компьютера.