IT rekvalifikácia. Seniorní programátori zarábajú až 6 000 €/mesiac a rekvalifikácia je prvým krokom. Zisti, ako na to!

8. diel - Tvorba formulárového frameworku v PHP - Motivácia

Vitajte u ďalšieho dielu seriálu tutoriálov o tvorbe PHP knižníc. V minulej lekcii, Dokončenie knižnice ArrayUtils v PHP , sme dokončili pomocnú knižnicu pre prácu s poľami. V dnešnom tutoriále začneme pracovať na väčšie, hoci stále minimalistické knižnici, ktorá za nás vyrieši všetky starosti ohľadom formulárov. Formuláre sa vo webovej aplikácii vyskytujú veľmi často a tvoria jej značnú časť. Uvidíte, že vďaka knižnici vo svojich aplikáciách ušetríte obrovské množstvo kódu a času. Pretože nám jej tvorba zaberie hneď niekoľko dielov a bude sa jednať o pomerne pokročilú vec, rozhodol som sa celý dnešný diel venovať motiváciu, aby bola vidieť jej pridaná hodnota. Čo sa týka názvoslovie, jedná sa už skôr o menšie framework ako knižnicu, však v seriáli budem tieto označenia zamieňať.

Formuláre v čistom PHP

Ukážme si, čo všetko musíme v čistom PHP napísať, aby sme uložili niekoľko políčok z formulára do databázy. Všetko si budeme ukazovať na zjednodušenom formulári pre objednanie automobilu, ktorý vyzerá takto:

Tvorba formulárov v PHP - Knižnice pre PHP

HTML kód

Akonáhle tvoríme nejaký formulár, začíname najčastejšie HTML kódom. Budeme chcieť, aby formulár nejako vyzeral a bol responzívne, preto musíme navyše použiť nejaké divy a Span. Tiež budeme používať HTML 5 atribúty pre klientské validácie, ktoré pre náš príklad maximálne zjednodušíme. Náš HTML kód by vyzeral asi takto:

<form method="POST" id="objednavka-auta" class="fancyform">
    <div class="form-component">
        <label for="jmeno">Jméno</label>
        <input name="jmeno" id="jmeno" required="required" type="text"/>
        <div class="clear"></div>
    </div>
    <div class="form-component">
        <label for="email">E-mail</label>
        <input name="email" id="email" type="email" />
        <div class="clear"></div>
    </div>
    <div class="form-component">
        <label for="znacka_vozu">Značka</label>
        <select name="znacka_vozu" id="znacka_vozu" required="required">
            <option value="skoda">Škoda</option>
            <option value="bmw">BMW</option>
            <option value="audi">Audi</option>
        </select>
        <div class="clear"></div>
    </div>
    <div class="form-component">
        <label for="nahon">Náhon</label>
        <select name="nahon" id="nahon" required="required">
            <option value="predni">Přední</option>
            <option value="zadni">Zadní</option>
            <option value="vse">Všechny</option>
        </select>
        <div class="clear"></div>
    </div>
    <div class="form-component">
        <label for="zpusob_platby">Způsob platby</label>
        <div name="zpusob_platby" id="zpusob_platby" class="radio-horizontal">
            <span>
                <input name="zpusob_platby" id="zpusob_platby1" value="prevodem" type="radio" checked="checked"/>
                <label for="zpusob-platby1">Převodem</label>
            </span>
            <span>
                <input name="zpusob_platby" id="zpusob_platby2" value="sekem" type="radio"/>
                <label for="zpusob_platby2">Šekem</label>
            </span>
            <span>
                <input name="zpusob_platby" id="zpusob_platby3" value="hotovost" type="radio"/>
                <label for="zpusob_platby3">V hotovosti</label>
            </span>
        </div>
        <div class="clear"></div>
    </div>
    <div class="form-component">
        <label for="poznamka">Poznámka</label>
        <textarea name="poznamka" id="poznamka"></textarea>
        <div class="clear"></div>
    </div>
    <div class="form-component">
        <label for="vybava">Výbava</label>
        <div name="vybava" id="vybava" class="radio-horizontal">
            <span>
                <input type="checkbox" name="abs" value="1" id="vybavaabs"/>
                <label for="vybavaabs">ABS</label>
            </span>
            <span>
                <input type="checkbox" name="sterace" value="1" id="vybavasterace"/>
                <label for="vybavasterace">Stěrače</label>
            </span>
            <span><input type="checkbox" name="asr" value="1" id="vybavaasr"/>
                <label for="vybavaasr">ASR</label>
            </span>
            <span>
                <input type="checkbox" name="eps" value="1" id="vybavaeps"/>
                <label for="vybavaeps">EPS</label>
            </span>
        </div>
        <div class="clear"></div>
    </div>
    <div class="form-buttons">
        <input name="objednat" id="objednat" value="Objednat" type="submit"/>
    </div>
</form>

Kód má zatiaľ 74 riadok a zobrazuje 7 políčok, to naozaj nie je efektívne. A bude horšie.

Validácia

Dáta musíme zvalidovat znova aj na serveri, pretože sa na klientsku validáciu nemôžeme spoľahnúť, tá slúži naozaj len pre klientov, aby videli, čo majú zle. Aby sme sa vyhli uloženie nezmyselných hodnôt do databázy, prevedieme aspoň jednoduchú serverovú validáciu:

if (isset($_POST['jmeno']) && ($_POST['jmeno']) &&
    (!isset($_POST['email']) || (preg_match('/^([a-zA-Z0-9])+([a-zA-Z0-9\._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/u', $_POST['email']))) &&
    isset($_POST['znacka_vozu']) && ($_POST['znacka_vozu']) &&
    isset($_POST['nahon']) && ($_POST['nahon']) &&
    isset($_POST['zpusob_platby']) &&
    isset($_POST['poznamka']) &&
    isset($_POST['vybava']))

Sme na 81 riadkoch.

Uloženie hodnôt do databázy

Objednávku uložíme do databázy asi takto:

Db::dotaz('
    INSERT INTO `objednavka` (jmeno, email, znacka_vozu, nahon, zpusob_platby, poznamka, vybava)
    VALUES
    (?, ?, ?, ?, ?, ?, ?)
', $_POST['jmeno'], $_POST['email'], $_POST['znacka_vozu'], $_POST['nahon'], $_POST['zpusob_platby'], $_POST['poznamka'], $_POST['vybava']);

Celkom 86 riadkov pre vloženie siedmich políčok do databázy.

Formulárové knižnica

Teraz si ukážme, ako by vyzeralo spracovanie identického formuláre pomocou našej knižnice.

Definície formulára

Formulár vytvoríme ako inštanciu triedy Form a pridáme do neho jednotlivé polia:

$form = new Form('objednavka-auta');
$form->addTextBox('jmeno', 'Jméno', true);
$form->addEmailBox('email', 'E-mail', false);
$form->addComboBox('znacka_vozu', 'Značka', true)
    ->setValues(array(
        'Škoda' => 'skoda',
        'BMW' => 'bmw',
        'Audi' => 'audi',
    ));
$form->addListBox('nahon', 'Náhon', true, false)
    ->setValues(array(
        'Přední' => 'predni',
        'Zadní' => 'zadni',
        'Všechny' => 'vse',
    ));
$form->addRadioGroup('zpusob_platby', 'Způsob platby', true)
    ->setValues(array(
        'Převodem' => 'prevodem',
        'Šekem' => 'sekem',
        'V hotovosti' => 'hotovost',
    ));
$form->addTextArea('poznamka', 'Poznámka', false);
$form->addCheckList('vybava', 'Výbava')
    ->setValues(array(
        'ABS' => 'abs',
        'Stěrače' => 'sterace',
        'ASR' => 'asr',
        'EPS' => 'eps',
    ));
$form->addButton('objednat', 'Objednat');

Zatiaľ máme 29 riadok pre 7 polí, čo je dobrý pomer. Riadky navyše sú len možnosti k výberu.

HTML kód

HTML kód sa vygeneruje plne automaticky, stačí iba zavolať metódu render () na inštanciu formulára:

<?= $form->render() ?>

Validácia

Serverové validácia prebehnú plne automaticky pri prvom pokuse o čítanie hodnôt z formulára.

Uloženie hodnôt do databázy

Ak formulárový framework použijeme spolu s miestnym databázovým frameworkom, bude uloženie dát do databázy vyzerať nasledovne:

Db::insert('objednavka', $form->getData());

Celková veľkosť kódu: 31 riadkov oproti 86 riadkom bez použitia frameworku. Cez 60% kódu sme úplne vyhodili a nestalo sa vôbec nič. Za zvyšný čas by sme napísali ešte ďalšie 2 formulára. Príklad bol naozaj veľmi zjednodušený, v praxi by boli rozdiely na väčších formulároch a zložitejších overeniach ešte markantnejší.

Ďalšie funkcie

Formulárový framework samozrejme vie aj veľa ďalších vecí, ktorými som príklad nechcel zaťažovať:

  • Ďalšie pole - Ďalšie formulárové polia, ako listbox, FileBoxy, PasswordBoxy a ďalšie.
    • Čiastočný rendering - Formulár možno vyrenderovať i po častiach, keď chcete napr. Iný layout, niekde obrázok alebo nadpisy, rozdeliť formulár na viacero stránok, nejaká špeciálna JavaScriptová tlačidlá a podobne.
    • Viac formulárov - Knižnica sa jednoducho vysporiada s niekoľkými formulármi na jednej stránke.
    • Načítanie len časti dát - Metódou getData () môžete získať i len časť dát. To využijete v prípade, keď sú vo formulári polia, ktoré do databázy ukladať nechcete (napr. Captcha).
    • Naplnenie formuláre dátami - Metódou setData () naplníte formulár výsledkom dotazu z databázy, čo sa využije napr. Pri editácii záznamov.

A to hlavné: Knižnica je minimalistická a je navrhnutá tak, aby ju šlo jednoducho rozširovať a upravovať. Dúfam, že som vás dostatočne namotivoval. Nabudúce, v lekcii Tvorba formulárového frameworku v PHP - HtmlBuilder , sa pustíme do prvej pomocnej triedy, ktorú bude HtmlBuilder.


 

Predchádzajúci článok
Dokončenie knižnice ArrayUtils v PHP
Všetky články v sekcii
Knižnice pre PHP
Preskočiť článok
(neodporúčame)
Tvorba formulárového frameworku v PHP - HtmlBuilder
Článok pre vás napísal David Hartinger
Avatar
Užívateľské hodnotenie:
Ešte nikto nehodnotil, buď prvý!
David je zakladatelem ITnetwork a programování se profesionálně věnuje 15 let. Má rád Nirvanu, nemovitosti a svobodu podnikání.
Unicorn university David sa informačné technológie naučil na Unicorn University - prestížnej súkromnej vysokej škole IT a ekonómie.
Aktivity