Vícenásobné odeslání formuláře. Skryté pole HIDDEN. Deaktivujte nebo povolte tlačítko Odeslat

S příchodem HTML5 se formuláře staly všestrannějšími. Vstupní prvek nyní může obsahovat emailová adresa, data a další, lze je označit podle potřeby bez použití javascriptu – a to jsou jen některé z nejcennějších funkcí. Nyní můžete také použít několik tlačítek pro odeslání pro jeden formulář a nyní je možné přesunout tlačítko pro odeslání mimo formulář.

Více odeslání v rámci jednoho formuláře

Donedávna bylo možné do formuláře vložit pouze jedno tlačítko pro odeslání, jinak by formulář zpracoval pouze poslední tlačítko. Přidáním method="post" a url do prvku formuláře "form" jsme získali funkční formulář.

Nyní se situace změnila – do HTML byly přidány nové vlastnosti „formmethod“ a „formaction“. Umožňují přidat metodu příspěvku a url přímo do tlačítka „odeslat“, takže do formuláře nemusíte nic přidávat. Pokud jsou tyto parametry připojeny k tlačítku "odeslat" spíše než k formuláři, dodává to formuláři větší flexibilitu. Nyní můžete vytvořit tolik tlačítek, kolik potřebujete pro formulář.

Nyní patří každé tlačítko „odeslat“. různé adresy URL a to vše eliminuje potřebu psát javascriptový kód. To vše funguje skvěle a nyní, když kliknete na tlačítko, formulář obdrží metodu formuláře a formátování, které přepíše standardní parametry metoda a akce. Pokud formulář obsahuje běžné tlačítko „odeslat“ bez nových parametrů, vrátí hodnoty formuláře nastavené pro prvek formuláře.

Vlastnosti formmethod a formation jsou podporovány všemi populární prohlížeče

Prvky formuláře (vstup, výběr, textová oblast) mimo formulář

Je obecně uznávaným faktem, že všechny prvky formuláře, které k němu patří, musí být umístěny uvnitř prvku

. To snižuje flexibilitu při návrhu samotných formulářů. Díky novému atributu „form“ lze nyní jakýkoli prvek přesunout mimo formulář a jakýkoli prvek formuláře lze umístit do libovolné části stránky. K tomu potřebujete pouze formulář přidejte ID a poté přidejte hodnotu tohoto ID ke všem prvkům jako atribut.

Dnes je atribut formuláře podporován všemi populárními prohlížeči, s výjimkou internet Explorer(až do verze 10).

Samotný formulář je obvykle určen k přijímání informací od uživatele pro jejich další odesílání na server, kde jsou data formuláře přijímána obslužným programem. Takový program lze napsat v libovolném programovacím jazyce na straně serveru, jako je PHP, Perl atd. Adresa programu je uvedena v atributu action tagu

, jak je ukázáno v příkladu 1.

Příklad 1: Odeslání údajů z formuláře

HTML5 IE Cr Op Sa Fx

Data formuláře



V tomto příkladu budou data formuláře označená atributem name (login a heslo) předána do souboru na /example/handler.php. Pokud atribut action není zadán, dojde k přenosu na adresu aktuální stránky.

Přenos na server probíhá ve dvou různé metody: GET a POST pro nastavení metody ve značce

Použije se atribut method a jeho hodnotami jsou klíčová slova get a post. Pokud atribut metody není zadán, jsou data standardně odesílána na server pomocí metody GET. V tabulce Obrázek 1 ukazuje rozdíly mezi těmito metodami.

Která metoda je použita, lze snadno určit podle adresního řádku prohlížeče. Pokud se objevilo otazník a adresa vypadá takto, pak je to určitě GET.

http://www.google.ru/search?q=%D1%81%D0%B8%D1%81%D1%8C%D0%BA%D0%B8&ie=utf-8

Jedinečná kombinace parametrů v adresním řádku jednoznačně identifikuje stránku, takže stránky s adresami ?q=node/add a ?q=node jsou považovány za odlišné. Tuto funkci využívají redakční systémy (CMS, Redakční systém) k vytváření mnoha webových stránek. Ve skutečnosti se používá jeden soubor, který přijímá požadavek GET a podle ní tvoří obsah dokumentu.

Níže jsou uvedeny typické aplikace těchto metod na stránkách.

DOSTAT

Přenos malých textových dat na server; Vyhledávání na webu.

Vyhledávače a formuláře pro vyhledávání na stránkách jsou vždy odesílány pomocí metody GET, což vám umožňuje sdílet výsledky vyhledávání s přáteli, poslat odkaz poštou nebo jej zveřejnit na fóru.

POŠTA

Přenos souborů (fotografie, archivy, programy atd.); zasílání komentářů; přidávání a úprava zpráv na fóru, blogu.

Ve výchozím nastavení se formulář zpracovává na aktuální kartě prohlížeče, při odesílání formuláře však můžete tento parametr změnit a otevřít obslužný program formuláře na nové kartě nebo rámu. Toto chování je specifikováno prostřednictvím „kontextového názvu“, což je hodnota cílový atributštítek . Oblíbené hodnoty jsou _blank pro otevření formuláře v novém okně nebo kartě a název rámce, který je určen atributem název štítku



V tomto příkladu se po klepnutí na tlačítko Odeslat otevře výsledek odeslání formuláře v rámci s názvem area .

Prvky formuláře jsou tradičně umístěny uvnitř značky

, čímž určí data, která budou přenášena na server. HTML5 má zároveň schopnost oddělit formulář od jeho prvků. Děje se tak z důvodu pohodlí a všestrannosti, takže složité rozvržení může obsahovat několik formulářů, které by se neměly vzájemně protínat, nebo se například některé prvky zobrazují pomocí skriptů na jednom místě na stránce a samotný formulář je umístěn na jiném místě. . Ke spojení mezi formulářem a jeho prvky v tomto případě dochází prostřednictvím identifikátoru formuláře a prvky by měly být přidány atribut formuláře s hodnotou rovnou tomuto identifikátoru (příklad 3).

Příklad 3: Propojení formuláře s poli

HTML5 IE Cr Op Sa Fx

Formulář



V tomto příkladu tag

je jednoznačně identifikován prostřednictvím identifikátoru auth a do polí, která by měla být odeslána prostřednictvím formuláře, se přidá form="auth". V tomto případě se chování prvků po kliknutí na tlačítko nemění, přihlašovací jméno a heslo jsou odeslány handler.php.

Ačkoli parametry přenosu formuláře jsou tradičně specifikovány v tagu , lze je také přenést na tlačítka odeslání formuláře (

Co se stalo:

Tlačítko s textem Poslat
  • Knoflík PŘEDLOŽIT- určené k odesílání dat na server. Jeho vzhled se neliší od ostatních tlačítek, ale když na něj kliknete, spustí se serverový program, specifikované parametrem akceštítek FORMULÁŘ. Tento program, nazývaný také form handler, přijímá data zadaná uživatelem do polí formuláře, provádí s nimi potřebné manipulace a výsledek pak vrací ve formě HTML dokumentu. Co přesně handler dělá, závisí na autorovi webu; Podobná technologie se tedy používá k vytváření průzkumů, fór, návštěvních knih, testů a mnoha dalších věcí.



Prohlížeč zobrazí:

  • Knoflík RESETOVAT- když stisknete tlačítko RESETOVAT data formuláře se vrátí na původní hodnotu. Toto tlačítko se obvykle používá k vymazání informací zadaných do polí formuláře. Ale pro velké formuláře pomocí tlačítka RESETOVAT Je lepší odmítnout úplně, abyste na něj omylem neklikli, protože pak budete muset formulář vyplnit znovu.

Níže je formulář s jedním textové pole který již obsahuje předem zadaný text pomocí parametru hodnotaštítek VSTUP. Po změně textu a kliknutí na tlačítko "Vymazat" se hodnota pole obnoví a opět se v něm objeví hláška "Zadejte text".





Podívejme se na kód html formuláře na displeji prohlížeče: Toto pole má tři hlavní parametry: název, hodnota A kontrolovány:

  • název- jednoznačně identifikuje pole, navíc, protože přepínače jsou prvky skupiny, musí být názvy všech prvků skupiny stejné. Tento přístup jednoznačně stanoví, že obor patří do určité skupiny.
  • hodnota- určuje, jaká hodnota bude odeslána na server. Zde musí mít každý prvek svou jedinečnou hodnotu, aby bylo možné identifikovat, která položka byla uživatelem vybrána.
  • kontrolovány- slouží k předvolbě položky seznamu.

Podle definice může mít sada přepínačů vybranou pouze jednu položku, takže se přidává kontrolovány do několika polí najednou nepovede k žádnému vynikajícímu výsledku. V každém případě bude označen prvek, který se v HTML kódu objeví jako poslední.


Kolik je 2+2?
3
4
Temný

V prohlížeči bude formulář vypadat takto:

Kolik je 2+2?
3
4
Temný

Zaškrtávací políčka

Zaškrtávací políčka (zaškrtávací políčko) používá se, když je nutné vybrat dvě nebo více možností z navrhovaného seznamu. Pokud potřebujete vybrat pouze jednu možnost, dejte přednost přepínačům (přepínač).

Parametry zaškrtávacích políček jsou shodné s přepínači, konkrétně: název určuje název pole, hodnota- jeho hodnota, a kontrolovány nastaví zaškrtávací políčko jako zaškrtnuté. V tomto případě je každé zaškrtávací políčko ve skupině považováno za nezávislé, takže jejich názvy a hodnoty se musí lišit.


S čím operační systémy znáte se?
Windows 95/98
Windows 2000
Systém X
Linux
X3-DOS

Zobrazí se prohlížeč.

Na webových stránkách často najdete stránky, na kterých jsou umístěny formuláře HTML. Webové formuláře – pohodlný způsob získávání informací od návštěvníků vašich stránek. Příkladem toho je - , - který poskytuje zpětná vazba s návštěvníky webu a vývojáři. Formuláře jsou také vhodné pro vývojáře webu při vývoji CMS, což jim umožňuje zachovat hlavní vlastnost webu – relevanci. Tento článek je věnován základům tvorby HTML formulářů, jejich zpracování a způsobům přenosu dat z obrazovkových formulářů do PHP skriptů.

1) Vytvořte jednoduchý formulář

Tagy

A
definovat začátek a konec formuláře. Značka počátečního formuláře
obsahuje dva atributy: akce A metoda. akční atribut obsahuje URL adresa skript, který musí být volán ke zpracování skriptu. Atribut metoda sděluje prohlížeči jaký druh HTTP požadavek musí být použito k odeslání formuláře; možné hodnoty POŠTA A DOSTAT.

Komentář

Hlavním rozdílem mezi metodami POST a GET je způsob přenosu informací. V metoda GET parametry se předávají přes adresní řádek, tj. v podstatě v hlavičce požadavku HTTP, zatímco in Metoda POST parametry jsou přenášeny prostřednictvím těla HTTP požadavku a nijak se neprojevují v adresním řádku.

$text = nl2br($_POST["mytext"]);
?>

Úkol: Předpokládejme, že potřebujete vytvořit rozevírací seznam s roky od 2000 do 2050.
Řešení: Potřeba vytvořit HTML formulář s prvkem SELECT a PHP – skript pro zpracování formuláře.

Diskuse:

Nejprve vytvoříme dva soubory: formulář.html A action.php. V souboru formulář.html bude obsahovat html formulář s rozevíracím seznamem. Kromě toho lze hodnoty v seznamu zadat dvěma způsoby:

I. Ruční zadávání dat:

II. Zadávání dat pomocí smyčky:

Jak vidíte, druhý příklad se smyčkou je kompaktnější. Myslím, že pro tento formulář není potřeba uvádět handler skript, protože se zpracovává úplně stejně jako textové pole, tzn. hodnoty seznamu lze načíst superglobální pole $_POST.

Popis:

Vytvořme HTML formulář pro odeslání souboru na server.




Tento html formulář obsahuje prvek Procházet, který otevře dialogové okno pro výběr souboru k nahrání na server. Když stisknete tlačítko "Přenést soubor", je soubor předán skriptu handleru.

Poté musíte napsat skript handleru action.php. Před napsáním handleru se musíme rozhodnout, do kterého adresáře budeme soubor kopírovat:

if(isset($_FILES [ "mujsoubor" ])) // Pokud soubor existuje
{
$catalog = "../obrazek/" ; // Náš katalog
if (is_dir($catalog)) // Pokud takový adresář existuje
{
$myfile = $_FILES [ "myfile" ][ "tmp_name" ]; // Dočasný soubor
$myfile_name = $_FILES [ "myfile" ][ "name" ]; // Název souboru
if(! copy ($myfile, $catalog)) echo "Chyba při kopírování souboru". $myfile_name // Pokud se kopírování souboru nezdařilo
}
else mkdir (../image/" ); // Pokud takový adresář neexistuje, vytvoříme jej
}
?>

Komentář

Pokud důvěřujete uživatelům, že nahrávají jakékoli soubory na váš server, musíte být velmi opatrní. Útočníci mohou do obrázku nebo souboru vložit „špatný“ kód a odeslat jej na server. V takových případech musíte stahování souborů přísně kontrolovat.

Tento příklad ukazuje vytvoření adresáře a zkopírování souboru do tohoto adresáře na server.

Rád bych také předvedl příklad s prvkem zaškrtávací políčko. Tento prvek se mírně liší od ostatních prvků tím, že ne-li jedním z prvků zaškrtávací políčko'a není vybrána, pak superglobální proměnná $_POST vrátí prázdnou hodnotu:


Modrý
Černá
Bílý

if (!empty($_POST [ "moje barva" ])) echo $_POST [ "moje barva" ]; // Pokud je vybrán alespoň 1 prvek
jinak echo "Vyberte hodnotu";
?>

Pokusí se odeslat formulář na server.

Cena

Pokud se rozhodnete použít prvky


Horní