×
COOKIES
Prezeraním tejto stránky dochádza k spracovaniu cookies. Spracovaniu cookies zabránite v nastaveniach internetového prehliadača alebo nezobrazovaním tejto stránky v internetovom prehliadači.
Vytvárame riešenia

Spoznávame Dojox form manager - časť 4

V tejto časti venovanej widgetu Dojox form manager nepriamo nadviažem na druhý diel, ktorý demonštroval prácu s observerom. Hlavnou témou dnešného príspevku bude použitie atribútu data-dojo-attach-event, keďže ide o rovnaký postup ako pri práci s observerom.
Kým observer slúži pre prácu s udalosťami na elementoch formulára, pre obsluhu udalostí na neformulárových elementoch je možné použiť atribút data-dojo-attach-event. Hodnotou atribútu data-dojo-attach-event je dvojica key : value v podobe názvu udalosti a funkcie. Rovnako ako pri observeri aj pri definovaní funkcie pre udalosť je potrebné definovať prázdnu funkciu v HTML atribúte data-dojo-props. Ten musí byť umiestnený v elemente so zápisom data-dojo-type="dojox/form/Manager".
Práca s atribútom data-dojo-attach-event je rovnaká ako práca s observerom. To znamená, že funkciu, ktorá bude priradená udalosti, je potrebné najskôr uviesť v elemente definujúcom Dojox form manager. Následne je potrebné prepísať prázdnu funkciu pre udalosť, ktorá ale už bude obsahovať programový kód. To sa vykoná cez metódu mixin(). Widget je možné získať prostredníctvom metódy byId().
Nasledujúci príklad vytvorí Dojox form manager s elementmi <input> a <span>. Pre element <span> bude vytvorená funkcia reagujúca na udalosť click. Po kliknutí na text Click me sa v konzole zobrazí typ udalosti a textový obsah elementu <span>.
Príklad: Použitie atribútu data-dojo-attach-event vo widgete Dojox form manager.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<div data-dojo-type="dojox/form/Manager"
data-dojo-props="display : function() {}" id="formManager">
<input data-dojo-type="dijit/form/TextBox" name="textbox-field">
<span class="button" data-dojo-attach-event="onClick : display">
Click me
</span>
</div>
<script>
require(
["dojo/ready", "dojo/_base/lang", "dijit/registry",
"dojo/parser"],
function(ready, lang, registry, parser) {
ready(function() {
var node = registry.byId("formManager");
lang.mixin(node, {
display : function(evt) {
console.log("Event: " + evt.type + " Node value: " +
evt.target.innerText);
}
})
});
});
</script>
Prostredníctvom parametra evt je možné získať typ udalosti ako aj obsah elementu, nad ktorým bola udalosť click vyvolaná.

Záver

Nasledujúcej časti bude predstavený spôsob ako identifikovať element, ktorý spustil observer.


Dojo,programovanie,JavaScript,dojo,dojox/form/Manager,dijit/registry,dojo/_base/lang,data-dojo-attach-event,input,span,data-dojo-props,mixin,byId
Žiadna časť tohto článku nesmie byť reprodukovaná bez uvedenia autora a URL na túto stránku.
Viac informácií nájdete v sekcii O projekte.

Komentáre

Článok neobsahuje zatiaľ žiadne komentáre.

Pridať komentár

Meno (povinné)
Web
Správa (povinné)
Odoslať
Od najnovších