HTML 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  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 = "". $this->firstNullOption ."\n";
		} else {
			$option = "";
		}
		if (count($this->data) && is_array($this->data)) {
			foreach ($this->data as $key => $val) {
				$option .= "					(($key == $this->request) ? " selected" : "") .">". htmlspecialchars($val) ."\n";
			}
		}
		return $option;
	}

	public function setIntoSelect($text)
	{
		$this->intoSelect = $text;
	}

	/**
	 * metoda vracejici select-option podle definovanych vlastnosti
	 *
	 * @return $select vraci 
	 */
	public function getSelect()
	{
		$select = "intoSelect)? " ". $this->intoSelect : "") .">\n";
		$select .= $this->getOption();
		$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();
$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:

$select->setFirstNullOption("- jméno -");

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.