×
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ť 7

V tejto časti venovanej Dojox form manageru si predstavíme ďalší efektívny spôsob použitia tohto zaujímavého komponentu. Tentoraz pôjde o vytvorenie nového widgetu, ktorý rozšíri pôvodný widget, čím odpadá problém so scopom.
Ako prvé je potrebné vytvoriť widget, ktorého obsahom bude funkcia pre observer a event. Observer bude aplikovaný na widget dijit/form/TextBox a event na element <span>. Výhodou tohto riešenia je odstránenie problémov pri identifikácii elementov a hodnôt atribútov id čo je demonštrované prostredníctvom zápisu console.log(). Programátor týmto riešením získava silný nástroj pre prístup k požadovaným hodnotám a elementom, výsledkom čoho je rýchle identifikovanie widgetov.
Príklad: Widget s názvom extended-dfm.js.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
define([
"dojo/_base/declare",
"dojox/form/Manager"
],
function(declare, dfm)
{
return declare("extendedFormManager", [dfm], {
observerFunction : function(value, name, widget, event) {
console.log(value, name, widget, event);
console.log(this.domNode);
console.log(this.id);
console.log(widget.id);
},
eventFunction : function(event) {
console.log(event.type);
console.log(event.target);
console.log(event.target.id);
},
startup : function() {
this.inherited(arguments);
}
});
});
Po vytvorení widgetu stačí už len widget definovať v HTML a nahrať cez funkciu require().
Príklad: Zápis do elementu <body>.
1
2
3
4
5
6
7
8
9
<div data-dojo-type="extendedFormManager">
<input data-dojo-type="dijit/form/TextBox"
data-dojo-observer="observerFunction"
data-dojo-props="intermediateChanges : true" name="field">
<input data-dojo-type="dijit/form/CheckBox"
data-dojo-observer="observerFunction"
data-dojo-props="intermediateChanges : true" name="checkbox">
<span data-dojo-attach-event="onClick : eventFunction">Click me</span>
</div>
Príklad: Zápis do elementu <script>.
1
2
3
4
5
6
require(["dojo/ready", "extended-dfm", "dojo/parser"],
function(ready, parser) {
ready(function() {
});
});
Podmienkou pre fungovanie observera vo widgetoch je aplikovanie atribútu name.

Záver

Žiaľ aj toto riešenie nie je stále dokonalé. Problémom je ignorovanie eventu v atribúte data-dojo-attach-event, ak sa nachádza vo widgetoch. Ak je atribút data-dojo-attach-event aplikovaný na bežný element jazyka HTML, event bude spracovaný. Ak poznáte ďalšie zaujímavé riešenia pre dojox form manager, podeľte sa o ne prostredníctvom komentára.


Dojo,data-dojo-attach-event,data-dojo-attach-point,šablóna,template,programovanie,HTML,dojo,JavaScript,DOM,dojo/ready,dojo/_base/declare,dijit/_Widgetbase,dijit/_Templatedmixin,dojo/text!,dojox/form/Manager
Ž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