Dojo Mobile 在视图转换时设置字段

Question

我创建了一个 Bijit（Dojo dijit + 业务逻辑）和一个控制器 class。但是在控制器中，我无法在小部件中设置字段值。我能够在控制台上看到 "made it" 行，但字段值从未设置

我想在转换到 dojo/mobile/view 后尝试在表单上填写数据。

如有任何建议，我们将不胜感激。

HTML Fragment:

<div>
        <label for="streetNumber1">Street Number:</label> <input
            data-dojo-type="dijit/form/TextBox" type="text"
            name="streetNumber1" id="streetNumber1" required="required">
    </div>
    <div>
        <label for="streetName1">Street Name:</label> <input
            data-dojo-type="dijit/form/TextBox" type="text"
            name="streetName1" id="streetName1" required="required">
    </div>
    <div>
        <label for="city1">City:</label> <input
            data-dojo-type="dijit/form/TextBox" type="text" name="city1"
            id="city1">
    </div>
    <div>
        <label for="province1">Province/State:</label> <input
            data-dojo-type="dijit/form/TextBox" type="text" name="province1"
            id="province1">
    </div>
    <div>
        <label for="country1">Country:</label> <input
            data-dojo-type="dijit/form/TextBox" type="text" name="country1"
            id="country1">
    </div>
    <div>
        <label for="zipPostal1">Zip/Postal:</label> <input
            data-dojo-type="dijit/form/TextBox" type="text" name="zipPostal1"
            id="zipPostal1">
    </div>
    <div>
        <label for="email1">Email:</label> <input
            data-dojo-type="dijit/form/TextBox" type="email1" name="email" id="email1">
    </div>

Bijit Class:

    define([ "dijit/_Widget", "dijit/_TemplatedMixin",
            "dijit/_WidgetsInTemplateMixin",
            "dojo/text!customDijits/editAccountTemplate.html",
            "dojox/mobile/TextBox","dijit/form/TextBox",
            "dijit/form/NumberTextBox",
            "dojox/form/Manager", "dojox/mobile/FormLayout" ], function(  
                    _Widget, _TemplatedMixin,
            _WidgetsInTemplateMixin, template) {
        return dojo.declare([ _Widget, _TemplatedMixin, _WidgetsInTemplateMixin ],
                {
                    templateString : template,

                    //function to retrieve the data that was typed in
                    getData : function() {
                        if (this.myForm.validate()) {
                            var values = this.myForm.gatherFormValues();

                            delete values['ownerDocumentBody'];
                            delete values['myForm'];

                            return values;
                        } else {
                            return {
                                "INVALID FORM" : "INVALID"
                            };
                        }
                    },
                    //function that sets the fields to the appropriate data fetched
                    setData : function(values) {
                        this.myForm.setFormValues(values);
                    },
                    //function to clear all the field of the form
                    clearData: function(){
                        this.myForm.reset();
                    }
                });
    });

Controller class:

    define(["dojo/_base/declare", "dojo/on", "dojo/when",
            "dojo/_base/lang", "dojo/_base/array", "dojo/store/Memory",
            "dijit/registry", "dojo/Stateful", "dojo/request/xhr",
            "dijit/Dialog", "dojo/_base/json", "dojo/domReady!" ], 
    function(declare, on, when,
            lang, array, Memory, registry, Stateful, xhr, Dialog, json) {
        return declare([ Stateful ], {
            _customerData : null,
            _getData : null,
            _setData : null,
            _clearData: null,

            constructor : function() {

                this._customerData = registry.byId("editAccountWidget");
                this._getData = registry.byId("submitEditAccount");
                this._setData = registry.byId("setData2");
                this._clearData = registry.byId("clearDetails");
                var myView = registry.byId("editProfileView");


                myView.on("beforeTransitionIn", function() {
                    console.log("Made it");
                    //alert("Made it after transition");
                    xhr("json/customer.json", {
                        handleAs : "json"
                    }).then(lang.hitch(this, function(data) {
                        this._customerData.setData(data);
                    }));
                });

                on(this._setData, "click", lang.hitch(this, function() {
                    alert("Clicked");
                }));

                on(this._clearData, "click", lang.hitch(this, function() {
                    this._customerData.clearData();
                }));
            }
        });
    });

Answer 1

我需要在过渡范围内搭便车。这修复了它！

this.myView.on("afterTransitionIn", lang.hitch(this, function() {
                console.log("Made it");
                //alert("Made it after transition");
                xhr("json/customer.json", {
                    handleAs : "json"
                }).then(lang.hitch(this, function(data) {
                    this._customerData.setData(data);
                }));
            }));

Dojo Mobile 在视图转换时设置字段

Dojo Mobile Set Fields on View Transition

javascript

dojo

dijit.form

dojox.mobile