1. Základní informace
1.1. Popis ovládacího prvku
JavaScript je ovládací prvek, který umožňuje začlenění libovolného javascriptového kódu do těla editačního formuláře. Javascriptový kód bude automaticky spuštěn při načtení editačního formuláře, a je možné ho ladit přímo ve webovém prohlížeči v konzoli javascriptu (např. v prohlížeči Google Chrome je konzole pro ladění javascriptu zobrazena pomocí klávesové zkratky „CTRL+Shift+J“).
- Kód se spouští v okamžiku, kdy prohlížeč načte příslušné místo stránky – tedy před dokončením načtení celé stránky a dřív, než existují ovládací prvky umístěné níže, včetně tlačítek „Uložit“, „Smazat“ a „Zpět“. Kód, který s nimi pracuje, je proto vhodné umístit do ovládacího prvku JavaScript až na konec formuláře.
- Po ajaxové aktualizaci formuláře se kód znovu nespouští. V režimu FULLAJAXMODE() se naopak spouští až po načtení celé stránky a znovu po každé ajaxové aktualizaci; hodnoty dosazené serverem (proměnné, výsledky funkcí „SQL“ a „ngef“) přitom zůstávají z prvního načtení.
- Volbou „Zakázat JavaScript“ v nastavení editačního formuláře se ovládací prvky JavaScript nevykreslí. JavaScript v událostech ostatních ovládacích prvků a v poli „Klient“ tlačítek se tím nevypíná.
- Volání externí funkce stránkou „ngef.aspx“ je povolené jen tehdy, je-li text „ngef.aspx?Identifikátor“ zapsaný v kódu doslovně v uvozovkách – adresa složená z proměnných se nepovolí. Detailní popis je uveden v samostatné příručce Externí funkce.
- Proměnné a funkce použité v kódu vyhodnocuje server a jejich hodnoty se vkládají bez escapování – podrobnosti jsou uvedeny v samostatné příručce JavaScriptové funkce.
1.2. Vytvoření nového ovládacího prvku
- Detailní popis vytváření nových ovládacích prvků v editačním formuláři je uveden v samostatné příručce Vytváření ovládacích prvků editačního formuláře.
1.3. Editace nebo smazání ovládacího prvku
- U každého existujícího ovládacího prvku se po jeho levé straně v editačním formuláři zobrazuje ikona tužky, která slouží pro změnu nastavení ovládacího prvku nebo jeho smazání.
- Jednotlivé ovládací prvky mohou být v editačním formuláři vertikálně přesouvány metodou Drag&Drop. Přesunutí spočívá v chycení ovládacího prvku nejlépe za jeho název umístěný v levém sloupci editačního formuláře, a následném tažení až na požadované místo v editačním formuláři.
- Ovládací prvky je možné přesouvat jen se zaškrtnutým polem „Drag&Drop“ umístěným nad toolbarem s ovládacími prvky. Z bezpečnostních důvodů je toto pole po každém přihlášení do aplikace nezaškrtnuté, aby nedošlo k nechtěnému přesunutí ovládacího prvku.
2. Seznam záložek v dialogu nastavení ovládacího prvku
- Obecné – Nastavení obecných vlastností
- Nápověda – Nápověda k editoru javascriptového kódu
- Práva – Nastavení práv
- Administrace – Nastavení ostatních vlastností
2.1. Záložka „Obecné“
2.1.1. Název
- Název ovládacího prvku.
- Rozbalovací seznam nabízí názvy „display()“, „onchange()“, „onclick()“ a „beforeSave()“. Je-li kód ovládacího prvku prázdný, vloží výběr názvu do kódu odpovídající šablonu.
2.1.2. Proměnné a funkce
- Rozbalovací seznam s výběrem proměnných, javascriptových a serverových funkcí, které je možné používat uvnitř javascriptového kódu.
- Detailní popis proměnných je uveden v samostatné příručce Proměnné.
- Detailní popis javascriptových funkcí je uveden v samostatné příručce JavaScriptové funkce.
- Detailní popis serverových funkcí je uveden v samostatné příručce Serverové funkce.
2.1.3. Identifikátory
- Rozbalovací seznam s výběrem identifikátorů databázových ovládacích prvků, které je možné používat uvnitř javascriptového kódu.
2.2. Záložka „Nápověda“
- Přehled klávesových zkratek editoru javascriptového kódu. Záložka se zobrazuje jen při zapnutém editoru kódu.
2.3. Záložka „Práva“
2.3.1. Práva
- Práva definují seznam uživatelských skupin a uživatelů, kteří mají oprávnění na zobrazení ovládacího prvku v editačním formuláři.
2.3.2. Nahradit práva ostatním ovládacím prvkům
- Funkce „Nahradit práva ostatním ovládacím prvkům“ slouží pro sjednocení práv v rámci celého editačního formuláře u ovládacích prvků, které spolu z pohledu práv souvisí.
- Díky odkazu „Zobrazit...“ je možné zobrazit seznam všech ovládacích prvků v editačním formuláři včetně nastavení práv těchto ovládacích prvků. U každého ovládacího prvku je zobrazeno zaškrtávací tlačítko, kterým je možné ovládací prvek vybrat. Při uložení ovládacího prvku se následně nastaví stejná práva i těmto vybraným ovládacím prvkům.
- Alternativou pro sjednocení práv v rámci celého editačního formuláře je zobrazení reportu dostupného ze záložky „Práva podřízených objektů“ v nastavení editačního formuláře.
2.4. Záložka „Administrace“
- Záložka „Administrace“ se zobrazuje pouze u existujících ovládacích prvků.
2.4.1. Slovník
- Slovník zobrazuje seznam volání javascriptových funkcí „alert“ a „confirm“ a serverové funkce „COLORLEGEND“, použitých napříč celou instalací NET Genia.
- Vyhledávání ve slovníku slouží k navržení správného tvaru uživatelských hlášek a k udržení konzistence názvosloví v celé aplikaci.
2.4.2. Sledování změn
- Sledování změn zobrazuje detailní report se všemi provedenými změnami javascriptového kódu jednotlivými uživateli.
2.4.3. Porovnat
- Tlačítko „Porovnat“ slouží k porovnání javascriptového kódu na záložce „Obecné“ s jinou verzí kódu, kterou administrátor vloží do textového pole na záložce „Administrace“.
- Po stisknutí tlačítka se zobrazí porovnávací tabulka se dvěma sloupci:
- Obecné – hodnoty zobrazené na záložce „Obecné“,
- Administrace – odpovídající hodnoty ze záložky „Administrace“.
- Pokud se hodnoty ve stejné položce liší, systém rozdíl zvýrazní červeným textem.
- Slovní shrnutí neshod (např. „Obecné nerovná se Administrace“) se zobrazí v dialogu.
2.4.4. Reference
- Tlačítko „Reference“ slouží k zobrazení obsahu JavaScriptu ze záložky „Obecné“, ve kterém jsou nahrazeny všechny výskyty „el(BT123)“, „bt_Click(BT123)“, „button_Enable(BT123)“ a „button_Disable(BT123)“ za příslušné odkazy, pomocí kterých je možné rychle otevřít nastavení tlačítka, které je v těchto čtyřech javascriptových funkcích referencováno. Odkazy na nastavení dostanou i identifikátory databázových ovládacích prvků.
2.5. Tlačítka „Uložit“, „Uložit a pokračovat v editaci“, „Kopírovat“, „Smazat“ a „Zavřít“
- Tlačítko „Uložit“ – Uložení změn v nastavení ovládacího prvku.
- Tlačítko „Uložit a pokračovat v editaci“ – Uložení změn v nastavení ovládacího prvku a ponechání nastavení otevřeného pro další úpravy.
- Tlačítko „Kopírovat“ – Vytvoření nové kopie aktuálního ovládacího prvku se shodným nastavením, avšak s novým jedinečným identifikátorem.
- Tlačítko „Smazat“ – Trvalé odstranění ovládacího prvku.
- Tlačítko „Zavřít“ – Zavření dialogu s nastavením ovládacího prvku bez uložení změn.
3. Funkce display() a skrývání částí formuláře
- Většina editačních formulářů používá podmíněné skrývání částí formuláře v závislosti na hodnotách vyplněných v ovládacích prvcích (texty, checkboxy apod.). Typicky se nastavuje vlastnost „style.display“ u elementů „div“, „table“ a dalších.
- Z tohoto důvodu je zavedeným zvykem mít ve formuláři definovanou javascriptovou funkci „function display() {}“. Vzorový kód lze získat přímo v editoru javascriptu výběrem názvu „display()“ z rozbalovacího seznamu.
if (!adminMode)
{
// control_Disable(#ng_#);
}
function display()
{
if (adminMode) return;
// #ng_:Table#.style.display = jsDisplay(true);
}
display();
- Proměnná „adminMode“ určuje, zda je aktivní administrátorský režim. Hodnotu „false“ má v uživatelském režimu, v náhledu formuláře nebo nahlížecí stránky a také tehdy, když administrátor nemá oprávnění formulář měnit (aplikační skupina je vyhrazena vybraným administrátorům).
- Veškeré skrývání částí formuláře musí být umístěno až za řádkem „if (adminMode) return;“, aby měl administrátor vždy k dispozici kompletní zobrazení formuláře.
- Volání funkce „display();“ na posledním řádku je nezbytné k tomu, aby se skrývání provedlo již při prvotním renderování formuláře. Mezi deklarací funkce a tímto voláním je prázdný řádek.
- Funkci „display();“ je dále nutné volat z události „OnChange“ u všech ovládacích prvků, jejichž hodnota má vliv na viditelnost částí formuláře.
- Příklad obvyklé implementace funkce „display()“:
function display()
{
if (adminMode) return;
D1.style.display = jsDisplay(control_GetValue(#ng_stav#) == 'Nový');
D2.style.display = jsDisplay(#ng_zobrazit#.checked);
D3.style.display = jsDisplay(control_GetValue(#ng_stav#) == 'Nový' && #ng_zobrazit#.checked);
}
display();