Prečo metóda gatherFormValues() nefunguje správne

Pri práci s widgetom dojox form manager, ktorý je súčasťou templatu, môže nastať situácia, kedy zavolanie metódy gatherFormValues() vráti nesprávne výsledky, resp. nevráti všetky hodnoty formulára. Tejto chybe je možné zabrániť jednoduchým zápisom.

Dôvodom nesprávneho správania metódy gatherFormValues() je prítomnosť metódy startup() vo widgete a absencia zápisu this.inherited(arguments);. Uvedenú situáciu je možné demonštrovať na nasledujúcom príklade.

Príklad: Zápis do elementu <body>.

1
2
3
4
5
6
7
8
9
<div data-dojo-type="dfm"></div>
    
<script>
   require(["dojo/ready", "widget", "dojo/parser"], 
      function(ready, parser) {
        ready(function() {
        });
      });
</script>
<div data-dojo-type="dfm"></div>
    
<script>
   require(["dojo/ready", "widget", "dojo/parser"], 
      function(ready, parser) {
        ready(function() {
        });
      });
</script>

Príklad: Obsah súboru widget.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
30
31
32
33
34
35
36
37
define([
    "dojo/_base/declare",
    "dijit/_Widget",
    "dijit/_WidgetBase",
    "dijit/_TemplatedMixin",
    "dijit/_WidgetsInTemplateMixin",
    "dojo/text!template.html",
    "dijit/registry",
    "dojox/form/Manager",
    "dijit/form/TextBox",
    "dijit/form/Button"
],
    function(
        declare,
        _Widget,
        _WidgetBase,
        _TemplatedMixin,
        _WidgetsInTemplateMixin,
        template,
        registry
        ) {
        return declare("dfm", [
            _Widget,
            _TemplatedMixin,
            _WidgetsInTemplateMixin
        ], {
            templateString: template,
            startup: function() {
              // this.inherited(arguments); // remove comment
            },
            displayValues: function(evt) {
                var dfm = registry.byId("dfm");
                var values = dfm.gatherFormValues();
                console.log(values);
            }
        });
    });
define([
    "dojo/_base/declare",
    "dijit/_Widget",
    "dijit/_WidgetBase",
    "dijit/_TemplatedMixin",
    "dijit/_WidgetsInTemplateMixin",
    "dojo/text!template.html",
    "dijit/registry",
    "dojox/form/Manager",
    "dijit/form/TextBox",
    "dijit/form/Button"
],
    function(
        declare,
        _Widget,
        _WidgetBase,
        _TemplatedMixin,
        _WidgetsInTemplateMixin,
        template,
        registry
        ) {
        return declare("dfm", [
            _Widget,
            _TemplatedMixin,
            _WidgetsInTemplateMixin
        ], {
            templateString: template,
            startup: function() {
              // this.inherited(arguments); // remove comment
            },
            displayValues: function(evt) {
                var dfm = registry.byId("dfm");
                var values = dfm.gatherFormValues();
                console.log(values);
            }
        });
    });

Príklad: Obsah súboru template.html.

1
2
3
4
5
6
7
8
9
10
11
12
13
<div>
    <div data-dojo-type="dojox/form/Manager" id="dfm" 
    data-dojo-props="displayValues:function() {}">
        <div>
            <input data-dojo-type="dijit/form/TextBox" 
             value="Field 1" name="field1">
            <span class="dojoFormValue" 
             data-dojo-attach-point="field2">Field 2</span>
        </div>
        <div data-dojo-attach-event="click : displayValues" 
         data-dojo-type="dijit/form/Button">Display values</div>
    </div>
</div>
<div>
    <div data-dojo-type="dojox/form/Manager" id="dfm" 
    data-dojo-props="displayValues:function() {}">
        <div>
            <input data-dojo-type="dijit/form/TextBox" 
             value="Field 1" name="field1">
            <span class="dojoFormValue" 
             data-dojo-attach-point="field2">Field 2</span>
        </div>
        <div data-dojo-attach-event="click : displayValues" 
         data-dojo-type="dijit/form/Button">Display values</div>
    </div>
</div>

Odstránením komentára v metóde startup() sa zabezpečí spracovanie príkazu this.inherited(arguments); a správne fungovanie metódy gatherFormValues().

Záver

Viac informácií o widgete dojox form manager je uvedených v sérii článkov Spoznávame Dojox form manager.

Prečo metóda gatherFormValues() nefunguje správne

Záver

Komentáre

Pridať komentár