Jak na APEX 13:  Custom tlačítka v interaktivním gridu

Celý APEX je v podstatě jen HTML, Javascript a CSS. Takže pokud chci, mohu si ho jakkoliv upravit k obrazu svému.

Co kdybych chtěl v tabulce tlačítko, které mi z ní dokáže spouštět procedury pro příslušný záznam? Nebo potřebuji makro na zaokrouhlení všech čísel ve sloupci? Pojďme se podívat přesně na tyto dva příklady, jak snadno je v APEXu vytvoříme.

Konkrétně si ukážeme následující případy:

• Zaokrouhlení všech číselných údajů ve sloupci salary na tisíce.

• Přidání konkrétního zaměstnance do síně slávy.

Pro ukázku teto funkcionality použiji grid, který jsem si již vytvořil tady.

Zaokrouhlení salary

Pro tuto operaci bude nejlepší vytvořit tlačítko nahoru do gridu, protože jeho úkolem stejně bude spouštět zaokrouhlení pro celou tabulku.

Tlačítko nahoru do gridu dostanete jediným způsobem- javascriptem v atributech gridu. K tomu můžete použít následující script.

Není to nic složitého, nejprve otevřete config daného regionu, do něj přidáte tlačítko a na něm (id moje_akce) po té připnete funkci. V tomto scriptu mohu i měnit záznamy v gridu a to jak všechny na jednou, tak třeba jen na ty, které si zaškrtnu. K této funkci se v vrátíme v nějakém z následujících článků. Nyní se držme jednoduchého tlačítka.

Jediná akce, kterou moje tlačítko provádí je: $(‘#zaokrouhleni_button’).click();

Jde o stisknutí tlačítka, které vytvořím v APEXu a naplním ho příslušným pl/sql kódem který provede zaokrouhlení salary.

Nyní přidám javascript do APEXu a vytvořím tlačítko s id “zaokrouhleni_button”.



Tlačítko zatím jen obnoví stránku (provádí submit page). Nyní pro něj připravíme akci, která zaokrouhlí všechny záznamy a obnoví grid.



Ještě potřebujeme udělat malou poslední úpravu: schovat samotné tlačítko, které provádí pl/sql kód.

První příklad máme hotový! Trvalo to ani ne 5 minut a máte vytvořené tlačítko, které dokáže editovat celý sloupec. Tlačítko nemusí být umístěné nad regionem, ani pod ním, ale krásně vedle ostatních control tlačítek, přesně tam, kde ho uživatel požaduje.

Síně slávy

Pro tento účel si nejdříve vytvořím tabulku síň slávy. Bude obsahovat jen ID a jméno+příjmení. Poté z ní udělám grid bez možnosti editace hned vedle gridu se zaměstnanci.

Nakonec jsem uložil tabulky pod sebe, aby byly přehlednější i na malém displeji.

Následující krok je, přidání fiktivního sloupce, který bude obsahovat tlačítko, přidávající zaměstnance do síně slávy. Své tlačítko vytvořím v html. Pro jeho formátování použiji class round_btn a pro spouštění kódu funkci isKing(id).



Sloupec je potřeba zmenšit tak, aby bylo tlačítko uprostřed a dále použít css classy. Díky tomu bude tlačítko reagovat na pohyb myši a na kliknutí.



Teď to podstatné- funkce pro přidání zaměstnance do síně slávy. Opět budete potřebovat tlačítko, které bude provádět PL/SQL. Dále budete  potřebovat pole, kam si javascriptem předáte ID zmáčknutého tlačítka.



Nyní přidám dynamickou akci s SQL a refreshem a skryji tlačítko.

Nyní se zaměstnanec po zmáčknutí tlačítka objeví v tabulce síň slávy, která se nachází níže. Tento tutoriál je jen ukázkou toho, co jde v interaktivním gridu vytvářet. Možnosti jsou v podstatě neomezené.

Věřím, že vám tento článek ukázal mnoho možností, jak vytvářet custom řešení pro vaše potřeby.

V příštím tutoriálu bych se rád zaměřil na něco jednoduššího, jako jsou například validace a povinná pole.