如何在组件加载前设置hidden window 属性？

Question

在我的应用程序中，我有一个带有两个文本字段（电子邮件和密码）的登录 window 和将这些值提交到服务器的提交按钮：

    doLogin: function() {

        var me = this,
            form = me.lookupReference('form');

        me.getView().mask('Authenticating... Please wait...');

        form.submit({
            clientValidation: true,
            url: 'login.php',
            scope: me,
            success: 'onLoginSuccess',
            failure: 'onLoginFailure'
        });
    },

我希望在登录 window 中有一个选项“在此设备上记住我”，这样用户就不需要每次都输入凭据。我的想法是使用 cookie 来存储电子邮件和密码的值。所以，我在登录表单中添加了一个复选框，并且在成功登录后，如果复选框被选中，我将电子邮件保存在 cookie 中：

Ext.util.Cookies.set('MyApplication', user_email);

我对密码也一样。这些 cookie 可以在注销时清除。在应用程序的最开始，我可以读取那些 cookies

Ext.util.Cookies.get('MyApplication');

这可以在一开始就完成，或者例如在登录的“beforerenderer”事件上完成 window。
但是现在到了我应该跳过登录 window 的部分，如果用户选择了那个选项。实际上，我根本不想跳过那个 window – 我只想隐藏它并保持它的动作。

所以，是否可以在某个地方添加类似

的内容

if (Ext.util.Cookies.get('MyApplication')){
//    1.    hide the login window so it won't appear at all
//    2.    Set value of email and password textfields to stored values
//    3.    Submit such hidden form to the server
}

Answer 1

可以在beforerender事件中设置hidden然后提交表单，这样用户是看不到的（会以隐藏模式呈现）：

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create('Ext.form.Panel', {
            title: 'Simple Form',
            bodyPadding: 5,
            width: 350,

            // The form will submit an AJAX request to this URL when submitted
            url: 'save-form.php',

            // Fields will be arranged vertically, stretched to full width
            layout: 'anchor',
            defaults: {
                anchor: '100%'
            },

            // The fields
            defaultType: 'textfield',
            items: [{
                fieldLabel: 'Email',
                name: 'email',
                value: Ext.util.Cookies.get('email'),
                allowBlank: false
            }, {
                fieldLabel: 'password',
                name: 'password',
                allowBlank: false,
                inputType: 'password',
                value: Ext.util.Cookies.get('password')
            }],

            // Reset and Submit buttons
            buttons: [{
                text: 'Reset',
                handler: function () {
                    this.up('form').getForm().reset();
                }
            }, {
                text: 'Submit',
                formBind: true, //only enabled once the form is valid
                disabled: true,
                handler: function () {
                    var form = this.up('form').getForm();
                    if (form.isValid()) {
                        form.submit({
                            success: function (form, action) {
                                Ext.Msg.alert('Success', action.result.msg);
                            },
                            failure: function (form, action) {
                                Ext.Msg.alert('Failed', action.result.msg);
                            }
                        });
                    }
                }
            }],
            listeners: {
                beforerender: function(loginWindow) {
                    if(Ext.util.Cookies.get('email') && Ext.util.Cookies.get('password')) {
                        console.log('Hidden');
                        loginWindow.setHidden(true);
                        loginWindow.getForm().submit();
                    }
                }
            },
            renderTo: Ext.getBody()
        });
    }
});

如何在组件加载前设置hidden window 属性？

How to set hidden window property before the component is loaded?

authentication

cookies

extjs

hidden