Listopad 21st, 2006HTML Framework 1 - Select-option
Při programování v PHP se dostanete do fáze, kdy Vás přestane bavit znovu a znovu psát HTML kód pro formulářová políčka. Jedním ze způsobů jak si začít tvořit svou vlastní knihovnu takovýchto HTML komponent, je přejít na OOP kód a v závislosti na zkušennostech si předdefinovat to, co se často opakuje. Tím začnete tvořit svůj malý framework pro HTML výstup vašich webových aplikací.
Je jasné, že existuje spoustu hotových řešení, ale já jsem šel cestou (pro PHPčkáře osobitou) vlastní. Mou snahou je, se odprostit od psaní jakéhokoli HTML kódu při programování základních komponent. Při OOP návrhu tříd je dobré rozvrhnout, které třídy budou znovupoužitelné v jakékoli aplikaci a které nikoli. Jelikož se nyní bavím o HTML výstupu, který je pro PHP jako vzduch pro člověka, je jasné, že se jedná o třídy s vysokou znovupoužitelností.
Vytvořím si adresář /lib ve kterém budu mít třídy, které jsou znovupoužitelné v jakékoli webové aplikaci. Jelikož se jedná o HTML kód a formulářové políčko tak adresářovou strukturu definuji takto: /lib/HTML/Form/
První komponentou bude select-option.
Zkrácená ukázka vlastní třídy v souboru SelectOption.php:
* trida vracejici html select-option
@author Dostal Ales
* @version 1.0
* @date 21.11.2006
* @category lib
* @package HTML
* @subpackage Form
/
class HTML_Form_SelectOption
{
/***************************** ATRIBUTY TRIDY *****************************/
// atribut tridy pro nazev selectu
private $nazev;
// atribut tridy pro data, ktera jsou poslana v poli
private $data;
// atribut tridy pro vybrany radek
private $request;
// atribut tridy pro vytvoreni prazdneho radku v optionu
private $firstNullOption;
// vklada do tagu <select> vlastni kod-text, vyuzitelne zejmena pro onClick, apod.
private $intoSelect;
/****************************** METODY TRIDY ******************************/
/
* konstruktor tridy definujici nazev selectu, data a atribut tridy pro vybrani radku
@param String $nazev nazev selectu
* @param Array $data data selectu
* @param String $request vybrana hodnota selectu
/
public function __construct($nazev, array $data, $request = "")
{
$this->nazev = $nazev;
$this->data = $data;
$this->request = $request;
}
}
Do třídy dále dodefinuji setry na základní atributy a funkčnost tagu select-option:
* metoda nastavi nazev selectu
@param String $nazev nazev selectu
/
public function setNazev($nazev)
{
$this->nazev = $nazev;
}
/
* metoda nastavi data pro option
@param Array $data pole, kde klic je value v optionu a hodnota je nazev optionu
/
public function setData(array $data)
{
$this->data = $data;
}
/**
* metoda nastavujici vyber radku
@param String $request defunuje vyber radku
/
public function setRequest($request)
{
$this->request = $request;
}
Poslední věcí je definování metod na vrácení příslušného HTML kódu:
* metoda vytvarejici option pro select
* zohlednuje pouziti requestu
@return $option option pro select
/
public function getOption()
{
if (!empty($this->firstNullOption)) {
$option = „<option value=''>“. $this->firstNullOption .„</option>\n“;
} else {
$option = "";
}
if (count($this->data) && is_array($this->data)) {
foreach ($this->data as $key ⇒ $val) {
$option .= „<option value=‚“. htmlspecialchars($key) .„‘“.
(($key == $this->request) ? " selected" : "") .„>“. htmlspecialchars($val) .„</option>\n“;
}
}
return $option;
}
public function setIntoSelect($text)
{
$this->intoSelect = $text;
}
/
* metoda vracejici select-option podle definovanych vlastnosti
@return $select vraci <select><option></option></select>
*/
public function getSelect()
{
$select = „<select name=‚“. $this->nazev .„‘“. (!empty($this->intoSelect)? " „. $this->intoSelect : "") .“>\n„;
$select .= $this->getOption();
$select .= “</select>\n";
return $select;
}
Kompletní třída ke stažení: HTML_Form_SelectOption
Budu nadále předpokládat, že máte vyřešený problém s automatickým nahráváním daných tříd přes __autoload().
Nyní již přichází na řadu malá ukázka, jakým způsobem lze komponentu využívat:
$data = array(„ales“ ⇒ „Aleš“, „tomas“ ⇒ „Tomáš“);
$select = new HTML_Form_SelectOption(„jmeno“, $data, $_GET[„jmeno“]);
echo $select->getSelect();
Pokud budu chtít například definovat prázdnou nulovou položku, stačí pred zavoláním o HTML kód přídat:
Možností je samozřejmě více. Od definování javascriptového kodu do tagu select až po změnu dat, při použití jedné instance. Pokud by daná třída nevyhovovala, není samozřejmě problém přidat jakoukoli novou vlastnost (např. přidání k tagu css třídu, style, apod.).
Definování vlastních HTML komponent programátorovi natolik usnadní práci, že k opakovanému psaní HTML se snad již nikdy nevrátí.
Přístě se podívám na trošku složitější HTML tag: input.