×
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.
Technologický web Mateja Lednára
Spoznávajte svet technológií

Ako pridať novú funkcionalitu widgetu dijit/form/DateTextBox

V tomto článku pridám novú funkcionalitu widgetu dijit/form/DateTextBox. Ide o rozšírenie, ktoré nastaví aktuálny dátum. Na nižšie uvedenom príklade je demonštrovaný spôsob, ako vyriešiť bug, ktorý majú niektoré widgety, kam patrí aj DateTextBox či Textarea.
Neviem prečo, ale na niektorých widgetoch nefungujú eventy onKeyDown, onKeyPress a ďalšie, aj napriek tomu, že sú v API uvedené. Napríklad analýzou DateTextBox som zistil, že event keypress je handlovaný iba v rámci metódy, teda nie je možné prepísať ho. Z tohto dôvodu je potrebné hľadať iné riešenia, ktoré zbytočne narúšajú koncepciu vytvárania eventov.
Pre demonštrovanie rozšírenia widgetu DateTextBox je vytvorená funkcionalita, ktorá umožňuje prostredníctvom klávesy F4 nastaviť aktuálny dátum. Nová funkcionalita je vytvorené dvoma spôsobmi. Je na čitateľovi, ktorý variant si zvolí.
Príklad: Podpora klávesy F4 - variant 1.
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
30
31
32
33
34
35
36
37
38
/**
* DateTextBox with extended functionality / keyboard support
*
* F4 key sets current date
*
* @author : Matej Lednár
*/
define([
"dojo/on",
"dojo/_base/declare",
"dijit/form/DateTextBox"
], function (on, declare, DateTextBox) {
return declare([
DateTextBox
], {
setCurrentDate: function () {
this.set("value", new Date());
},
createKeyEvents: function () {
var widget = this;
var event = on(this.textbox, "keydown", function (evt) {
// F4 key sets current date
if (evt.keyCode === 115) {
widget.setCurrentDate();
}
});
this.own(event);
},
postCreate: function () {
this.inherited(arguments);
this.createKeyEvents();
}
});
});
Príklad: Podpora klávesy F4 - variant 2.
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
/**
* DateTextBox with extended functionality / keyboard support
*
* F4 key sets current date
*
* @author : Matej Lednár
*/
define([
"dojo/_base/declare",
"dijit/form/DateTextBox"
], function (declare, DateTextBox) {
return declare([
DateTextBox
], {
setCurrentDate: function () {
this.set("value", new Date());
},
_onKey: function (evt) {
this.inherited(arguments);
if (evt.keyCode === 115) {
this.setCurrentDate();
}
}
});
});
V prvom variante používam on a v druhom privátnu metódu _onKey.

Záver

V prípade, že máte iné zaujímavé riešenie, podeľte sa oň prostredníctvom komentára.
Dojo,dijit/form/DateTextBox,dojo/_base/declare,event,keyCode,_onKey,dijit/form/Textarea,onKeyDown,onKeyPress
Ž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