Элемент управления кнопка

Кнопки часто используются на HTML-страницах. Кнопки отличаются от ос­тальных элементов управления тем, что они не остаются нажатыми после щелч­ка по ним. Поэтому в тот момент, когда данные посылаются скрипту-обработчи­ку, кнопка уже давным-давно находится в отжатом состоянии. Как же опреде­ли , какая именно кнопка была нажата? Для этого можно использовать различные способы, и три из них приведены в этой главе. Одним из возможных вариантов является комбинированное использование РНР, JavaScript и скры­того поля, как показано в примере ниже. Когда пользователь щелкает по кнопке, функция JavaScript сохраняет соответствующую кнопке строку в скрытом поле и затем использует функцию submit для отправки результатов на web-сервер скрипту phpbuttons.php.

code: #javascript
<HTML>
<HEAD>
<TITLE>Кнопки:   вариант 1</TITLE>
</HEAD>
<BODY>
<H1>Кнопки:  вариант 1</H1>
<FORM NAME="forml" ACTION="phpbuttons.php" METHOD="POST">
<INPUT TYPE="HIDDEN" NAME="Button">
<INPUT TYPE="BUTTON" VALUE="Кнопка 1" ONCLICK="buttonl()">
<INPUT TYPE="BUTTON" VALUE="Кнопка 2" ONCLICK="button2()">
<INPUT TYPE="BUTTON" VALUE="Кнопка 3" ONCLICK="button3()">
</FORM>
<SCRIPT LANGUAGE="JavaScript">
<!--
function button1() {
  document.forml.Button.value = "кнопка 1";
  form1.submit();
}
 
function button2() {
  document.forml.Button.value = "кнопка 2";
  form1.submit();
}
 
function button3() {
  document.forml.Button.value = "кнопка 3";
  form1.submit();
}
//-->
</SCRIPT>
</BODY>
</HTML>

На рисунке представлен внешний вид рассмотренной формы с тремя кноп­кам:

На рисунке представлен внешний вид рассмотренной формы с тремя кноп­кам

Для определения того, какая кнопка нажата, следует всего лишь прочесть со­держимое скрытого поля Button, как показано в примере.

Результат вы­полнения скрипта в случае, если пользователь щелкнул по второй кнопке, при­веден на рисунке:

code: #php
<HTML>
<HEAD>
<TITLE>Кнопки</TITLE>
</HEAD>
<BODY>
<CENTER>
<H1>Кнопки</H1>
Нажата
<?php
if (isset($_REQUEST["Button"])) {
   echo $_REQUEST["Button"], "<BR>";
}
?>
</CENTER>
</BODY>
</HTML>
результат выполнения примера

До этого для определения нажатой кнопки использовался JavaScript. Но того же результата можно достигнуть, если использовать кнопку отправки вместо обычной кнопки. Для этого требуется три web-формы вместо одной, каждая со своей отдельной кнопкой отправки. Для определения того, ка­кая из трех кнопок нажата, в каждой форме используется скрытое поле с одним и тем же именем Button, но с различными значениями в этих трех формах. Это продемонстрировано в примере ниже.

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

code: #html
<HTML>
<HEAD>
<TITLE>Кнопки:  вариант 2</TITLE>
</HEAD>
<BODY>
<CENTER>
<H1>Кнопки:  вариант 2</H1>
<FORM NAME="form1" ACTION="phpbuttons.php" METHOD="POST">
<INPUT TYPE="HIDDEN" NAME="Button" VALUE="кнопка 1">
<INPUT TYPE="SUBMIT" VALUE="Кнопка 1">
</FORM>
 
<FORM NAME="form2" ACTION="phpbuttons.php" METHOD="POST">
<INPUT TYPE="HIDDEN" NAME="Button" VALUE="кнопка 2">
<INPUT TYPE="SUBMIT" VALUE="Кнопка 2">
</FORM>
 
<FORM NAME="form3" ACTION="phpbuttons.php" METHOD="POST">
<INPUT TYPE="HIDDEN" NAME="Button" VALUE="кнопка 3">
<INPUT TYPE="SUBMIT" VALUE="Кнопка 3">
</FORM>
</CENTER>
</BODY>
</HTML>

Внешний вид страницы приведен на рисунке:

Внешний вид страницы приведен на рисунке

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

До этого для идентификации нажатой кнопки использова­лись скрытые поля, но на самом деле можно обойтись без них вовсе. При помо­щи атрибута VALUE имеется возможность передать данные о кнопке PHP-скрипту, что делает использование скрытых полей ненужным. Для этого каждой кнопке отправки присваивается одно и то же имя Button (ранее это имя использовалось для скрытого поля). При этом при помощи атрибута VALUE каждой кнопке присваивается уникальное значение, по которому они и будут различаться. Код страницы, созданной по этой схеме, приведен в примере, а внешний вид — на рисунке. Обработчик данной страницы полностью идентичен двум предыдущим.

code: #html
<HTML>
<HEAD>
<TITLE>Кнопка:   вариант 3</TITLE>
</HEAD>
<BODY>
<CENTER>
<H1>Кнопки: вариант 3</H1>
 
<FORM NAME="form1" ACTION="phpbuttons.php" METHOD="POST">
<INPUT TYPE="SUBMIT" NAME="Button" VALUE="кнопка 1">
</FORM>
 
<FORM NAME="form2" ACTI0N="phpbuttons.php" METH0D="P0ST">
<INPUT TYPE="SUBMIT" NAME="Button" VALUE="кнопка 2">
</FORM>
 
<FORM NAME="form3" ACTI0N="phpbuttons.php" METH0D="P0ST">
<INPUT TYPE="SUBMIT" NAME="Button" VALUE="кнопка 3">
</FORM>
</CENTER>
</BODY>
</HTML>
внешний вид страницы с кнопками
Книга: PHP в примерах. Купить книгу
Автор: Стивен Хольцнер. Переводчик: С. Банников
Поделиться:

Похожие статьи: