Скрити полета
Ако уеб страницата съдържа няколко форми, можете да поставите скрити полета, които ще ви помогнат да идентифицирате коя форма е необходимо да бъде обработена, като й зададете име. Чрез скритите полета можете да контролирате коя форма кога да се покаже и кога да се обработи. В скритите полета можете да включите информация, която не искате да се показва на потребителя, например вашето име, датата на която е създадена формата, може да ги ползвате за предаване на временни или сесийни данни от една форма към друга или пък да съхраните информация, която вече е била вписана от потребителя.
Скритите полета не са видими във формата, но са видими в сорс кода на страницата, поради което в тях не бива да се вписва важна информация.
<!-- hidden_fields.php-->
<!DOCTYPE html>
<html>
<head>
<title>Скрити полета</title>
</head>
<meta http-equiv="Content-Type" content="text/html"; charset="UTF-8">
<body bgcolor="#ff66ff">
<font face="verdana">
<div align="center">
<b>
<?php
if (isset($_POST['back1']) && ($_POST['back1'] == 'process_form')){
process_form();
}
else{
display_form();
}
function display_form(){
echo <<<EOF
<form action="$_SERVER[PHP_SELF]" method="post">
Оценете страницата
<br><br>
<input type="radio" name="rating" value="отлично създадена"/>Отлична
<input type="radio" name="rating" value="много добре създадена" />Мн.добра
<input type="radio" name="rating" value="много досадна" />Досадна
<input type="radio" name="rating" value="безнадеждно скучна"/>Скучна
<input type="radio" name="rating" value="... я стига глупости"/>Я не ме занимавай с глупости
<input type="hidden" name="back1" value="process_form">
<input type="hidden" name="creation_date" value="December`3000" />
<br><br>
<input type="submit" value="Гласувай" />
<input type="reset" value="Изчисти" />
</form>
EOF;
}
function process_form(){
if(isset($_POST["rating"])){
echo "Тази страница е" . " " . $_POST["rating"] . "!";
}
}
?>
</b>
</div>
</body>
</html>
HTML форми и масиви
HTML формите, които позволяват на потребителя да направи повече от един избор, се създават с помощта на тага <select> (като му се постави атрибута "multiple") и <input types = “checkbox”>. Вместо РНР да генерира една променлива за множеството избори, е по-добре за тази цел да се използва масив. За да създадете масив, добавяте квадратни скоби към имената на таговете <select> и <input>.
Например:
<select name="books[]">
<input type=checkbox name="science[]" value="Химия на емоциите и поведението">
Когато потребителят кликне върху бутона submit, РНР ще създаде масив, чийто елементи ще са изборите, които потребителят е направил.
<!--select2.html-->
<!DOCTYPE html>
<html>
<head>
<title>Множество избори</title>
<meta http-equiv="Content-Type" content="text/html"; charset="UTF-8">
</head>
<body>
<div style= "width: 305px;
height: 490px;
background-image:
linear-gradient(to right, white 0%, #0059b3 100%), url('ex2.png');
background-position: top right;
background-repeat:no-repeat;
background-blend-mode: overlay; border:2px solid black; ">
<form action="select2_handle.php" method="POST" style="width: 300px; ">
<fieldset style="margin-left: 10px;">
<legend style="color: #001f4d;">Вашето желание</legend><br>
<label style="color:red;">Изберете континент:</label><br><br>
<span style="font-size:12px; text-decoration-line:underline; text-decoration-style:wavy;">
<i>За да направите няколко избора едновременно,
кликнете върху клавиш Ctrl от клавиатурата, докато селектирате.</i></span><br><br>
<select name="location[]" multiple style="background-color: #e0e0d1;">
<option>Европа</option>
<option>Антарктида</option>
<option>Африка</option>
<option>Северна Америка</option>
</select><br><br>
<label style="color:red;">Изберете държава:</label><br><br>
<input type="checkbox" name="place[]" id="България" value="България" />
<label for="България">България</label><br>
<input type="checkbox" name="place[]" id="Южен полюс" value="Южен полюс" />
<label for="Южен полюс">Южен полюс</label><br>
<input type="checkbox" name="place[]" id="Египет" value="Египет" Checked/>
<label for="Египет">Египет</label><br>
<input type="checkbox" name="place[]" id="САЩ" value="САЩ" />
<label for="САЩ">САЩ</label><br>
<input type="checkbox" name="place[]" id="Канада" value="Канада"/>
<label for="Канада">Канада</label><br><br>
<input type="submit" value="Избери" />
<input type="reset" value="Изчисти" />
</fieldset>
</form>
</div>
</body>
</html>
Съдържанието на файла, обработващ формата:
<!--select2_handle.php -->
<!DOCTYPE html>
<html>
<head>
<title>Форми и масиви</title>
<meta http-equiv="Content-Type" content="text/html"; charset="UTF-8">
</head>
<body >
<br />
<fieldset style="width:300px;">
<legend><b>Избрахте континентите:</b></legend>
<?php
//Обработва данните от select2.html
if (is_array($_POST['location'])){
print "<table style='width:200px; border: 1px solid black;'><tr style='border: 1px solid black;'>";
foreach ( $_POST['location'] as $value ){
print "<td style='border: 1px solid black;'>$value</td>";
}
print "</tr></table>";
}
?>
</fieldset>
<fieldset style="width:300px;">
<legend><b>Избрахте държавите:</b></legend>
<?php
extract($_POST);
if (is_array($place)){
print "<table style='width:200px; border: 1px solid black;'><tr style='border: 1px solid black;'>";
foreach ( $place as $value ){
print "<td style='border: 1px solid black;'>$value</td>";
}
print "</tr></table>";
}
?>
</fieldset><br><br>
</body>
</html>
|
|---|
| Форма за множество избори |
|
|---|
| Обработена форма за множество избори |
HTML форми, работещи с изображение като submit бутон
За да превърнем изображение в бутон submit, е необходимо да приложим вместо <input type= "submit">, <input type= "image" >, да включим src за местоположението на изображението и име за полето:
<input type="image" src="път_до_изображението" name="име_на_изображението"/>Когато потребителят кликне върху изображението, формата ще бъде изпратена към сървъра, заедно с координатите на пиксела от изображението, върху който потребителят е кликнал. В РНР скрипта, координатите са представени като две променливи image_name_x и image_name_y (image_name е името, назначено на атрибута name, на полето за въвеждане (input type)) . Ще създадем форма, която ще се изпрати за обработка към сървъра, чрез кликване върху изображение, вместо върху бутон “submit”.
<!--image_button.html -->
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Бутон-изображение</title>
<meta charset="utf-8">
<style>
.button{
background-color: #4CAF50;
border: none;
color: white;
padding: 8px 16px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 14px;
margin: 2px 1px;
-webkit-transition-duration: 0.4s; /* Safari */
transition-duration: 0.4s;
cursor: pointer;
}
.button {
background-color: yellow;
color: black;
border: 1px solid #4CAF50;
}
.button:hover {
background-color: #4CAF50;
color: white;
}
.img {
display: inline-block;
border: 1px solid #009900;
-webkit-transition-duration: 0.4s; /* Safari */
transition-duration: 0.4s;
cursor: pointer;
}
.img:hover{
background-color: #FFD5A2;
}
</style>
</head>
<body>
<div style="width: 345px; height: 675px; background-color:#CCFF33; font: verdana; margin-left: 5px; ">
<fieldset style="width:200px;margin-left:8px;">
<legend >Избери пица::</legend>
<form method="post" action="image_button.php" >
<input type="checkbox" name="topping[]" id= "Маргарита" value="Маргарита"/>
<label for="Маргарита">Маргарита</label><br>
<input type="checkbox" name="topping[]" id= "Прошуто" value="Прошуто"/>
<label for="Прошуто">Прошуто</label><br>
<input type="checkbox" name="topping[]" id= "Ал Тоно" value="Ал Тоно"/>
<label for="Ал Тоно">Ал Тоно</label><br>
<input type="checkbox" name="topping[]" id= "Диаволо" value="Диаволо"/>
<label for="Диаволо">Диаволо</label><br>
<input type="checkbox" name="topping[]" id= "Куатро формаджи" value="Куатро формаджи"/>
<label for="Куатро формаджи">Куатро формаджи</label><br>
<p>Кликни върху изображението, за да поръчаш!<br /><br></p>
<input class="img" type="image" name="pizzas" src="pizza_chef.png" /><br /><br />
<input type=reset value="Изчисти" class="button"/>
</form>
</fieldset>
</div>
</body>
</html>
|
|---|
| Изображение вместо бутон Submit |
Скриптът, който ще обработва формата:
<!--image_button.php -->
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset=utf-8>
<title>Определяне на координатите</title>
<style>
.my{
width: 200px;
background-image: url('pizza.png');
background-repeat:no-repeat;
background-position: top right;
margin-top:10px;
margin-right:30px;
}
</style>
</head>
<body>
<?php
echo "<fieldset class=\"my\">";
echo "<legend>Вие избрахте:</legend>";
if ($_POST['topping']){
echo "<ol>";
foreach ( $_POST['topping'] as $value ){
print "<li>$value</li>";
}
echo "</ol>";
}
echo "<hr style=\"color:red;\">";
echo "Кликнахте върху точка с координати: <br />";
$coord1 = $_POST['pizzas_x'];
$coord2 = $_POST['pizzas_y'];
echo "x=$coord1, y=$coord2 ";
echo "</fieldset>";
?>
</body>
</html>
|
|---|
if (!empty($coord1 )) {
//действие
}
Self обработване на HTML форма
Може да искате да комбинирате документ, съдържащ HTML форма и РНР скрипт, който обработва формата, в един файл. Това се прави чрез назначаване на масива $_SERVER['PHP_SELF'] (Управляващи структури) към атрибута action на HTML формата.
Когато потребителят кликне върху бутона submit на формата, action атрибута се обръща към URL-а на същата страница, в която се намира и формата.
В този случай е необходима проверка дали формата е била подадена за обработка (дали е кликнато върху бутона submit).
<!--form_self.php -->
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset=utf-8>
<title></title>
<style>
:focus {
background-color: #D8F781;
}
.button{
background-color: #4CAF50;
border: none;
color: white;
padding: 8px 16px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 14px;
margin: 2px 1px;
-webkit-transition-duration: 0.4s; /* Safari */
transition-duration: 0.4s;
cursor: pointer;
}
.button {
background-color: #FFFFFF;
color: #088A08;
border: 1px solid blue;
}
.button:hover {
background-color: #FA5858;
color: white;
}
div::before{
content: url('heart.png') "Вашите данни са: ";
background-repeat:no-repeat;
background-position:bottom left;
border-bottom: 1px dotted blue;
}
div{
width:216px;
height: 40px;
color:#088A08;
background-color:#D8F781;
padding:5px;
}
</style>
</head>
<body>
<fieldset style="width:200px;">
<legend style="color:#0000FF;"></legend><br>
<form action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" method="POST">
<label style="color:#088A08;">Име:</label><br>
<input type="text" size=15 name="firstname" placeholder="Име" required autofocus><br><br>
<label style="color:#088A08;">Телефонен номер: </label><br>
<input id="phone" type="tel" size=15 name="phone" placeholder="0000 00 00 00" required autofocus><br><br>
<input class="button" type="submit" name="submit" value="Напред >>" style="padding: 5px; margin-right: 10px;">
<input class="button" type="reset" value="Изчисти" style="padding: 5px;">
</form>
</fieldset>
<div></div> <br>
<?php
/*Дефинираме променливите от формата и им задаваме като
стойност празен низ*/
$firstname= $phone= "";
//Проверява дали е кликнато върху бутона submit
if ( isset($_POST['submit'])){
$firstname= $_POST['firstname'];
$phone=$_POST['phone'];
echo "Вашето име е" . " " . "<b>" . stripslashes(trim(htmlspecialchars ($firstname))) . "<b>" . "<br>";
echo "Телефонният ви номер е" . " " . "<b>" . stripslashes(trim(htmlspecialchars ($phone))) . "<b>" . "<br>";
print "Пътят до файла е: ". htmlspecialchars($_SERVER["PHP_SELF"]);
//Задаваме имената на променливите за достъп до базата данни
$host = "localhost";
$user = "user";
$password = "password";
$DBName = "PolyDB";
$table_name = "Потребители";
//Свързваме се към MySQL сървъра и пишем заявката
//за вписване на данните от формата в БД
$link = new mysqli($host, "user", "password", "PolyDB") or die ("Невъзможно свързване");
$sql = "INSERT INTO $table_name (ID, Име, Телефон)
VALUES ('0', '$firstname', '$phone')";
if ($link->query($sql) === TRUE) {
echo "<br><br>Данните са успешно записани в БД.";
echo "<br><br>Вашето потребителско име е" . " " . "<span style = \"color: #EC2929;\"><b>$firstname </b></span>". ".<br/>";
echo "Вашият телефон е" . " " . "<span style = \"color: #EC2929;\"><b>$phone </b></span>". ".<br/>";
}
else{
echo "<span style = \"color: #0000FF;\">Данните не могат да бъдат вписани в БД!</span><br/><br/>". $link->error;
}
$link->close();
}
?>
</body>
</html>
|
|---|
| Self обработване на HTML страница |
Как да създадете таблица в базата данни: Бази от данни.
Пренасочване на потребител
А, ако сайтът ви е преместен на ново място? Необходимо е да го пренасочите към новия адрес в зависимост от някои условия, като например дали потребителят се е логнал, дали помни паролата си и т.н..
Пренасочването на потребителя към нова страница е лесно с РНР. Това се прави с функцията header(), за да модифицираме HTTP хедъра, изпрратен от сървъра.
<!-- redir.php--> <?php //Пренасочва потребителя към желаната дестинация header( 'Location: https://disneyland.disney.go.com' ); //Извежда съобщение за грешка, ако пренасочването не може да се извърши die(); ?>Хедърната информация трябва да бъде изпратена към браузъра преди какъвто и да е HTML текст, т.е. header() функцията трябва да се изпълни първа в скрипта.
Друг пример:
<!-- redirect.php--> <?php //Heredoc синтаксис за извеждане на съдържанието на формата $str = <<<EOD <html lang="en-US"> <head> <meta charset=utf-8> <title>Пренасочване на потребител</title> </head> <body bgcolor="#33ff33"> <form action="http://localhost/phpbegin/redirect_1.php" method="post"> <b> Избери машина за търсене:<br><br> </b> <select name="new_url"> <option value="" /> <option value="http://www.google.com" />Google <option value="http://www.yahoo.com" /> Yahoo! <option value="https://duckduckgo.com"//>DucDduckgo! </select><br><br> <input type="submit" value=" Пренасочване>>" /> </form> </body> </html> EOD; echo $str; ?>Файлът, осъществяващ пренасочването:
<?php
//redirect_1.php
extract($_POST);
if ($_POST['new_url']){
header("Location: $new_url");
}
else{
echo "Пренасочването не може да се осъществи.";
}
?>
|
|---|
| Пренасочване на потребител |
|
Няма коментари:
Публикуване на коментар