Question

我已经使用官方登录应用程序教程创建了简单的应用程序： Click Here

应用程序正常。但是它没有任何密码检查，我决定稍微搞乱它。这就是问题所在 - 如何从控制器中的定义形式中获取值？

更准确地说，我想进入＆＃34; onLoginClick＆＃34;监听器。

查看：

Ext.define('TutorialApp.view.login.Login', {
    extend: 'Ext.window.Window',
    xtype: 'login',

    requires: [
        'TutorialApp.view.login.LoginController',
        'Ext.form.Panel'
    ],

    controller: 'login',
    bodyPadding: 10,
    title: 'Login Window',
    closable: false,
    autoShow: true,

    items: {
        xtype: 'form',
        reference: 'form',
        items: [{
            xtype: 'textfield',
            name: 'username',
            fieldLabel: 'Username',
            allowBlank: false
        }, {
            xtype: 'textfield',
            name: 'password',
            inputType: 'password',
            fieldLabel: 'Password',
            allowBlank: false
        }, {
            xtype: 'displayfield',
            hideEmptyLabel: false,
            value: 'Enter any non-blank password'
        }],
        buttons: [{
            text: 'Login',
            formBind: true,
            listeners: {
                click: 'onLoginClick'
            }
        }]
    }
});

控制器：

Ext.define('TutorialApp.view.login.LoginController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.login',

    onLoginClick: function () {
        // get values here
    }
});

Answer 1

在onLoginClick内部，您可以通过me.up('window').down('form').getForm()访问该表单，该表单可用作ajax调用（或提交表单）以验证用户：

onLoginClick: function(me) {
    var form = me.up('window').down('form').getForm();
    if (form.isValid()) {
        form.submit({
            url: 'checkcredentials.php',  // your url
            params: null, // needed for additional params
            submitEmptyText: false,  // don't post empty text in fields
            success: function(form, action) {
               Ext.Msg.alert('Success', action.result.msg);
            },
            failure: function(form, action) {
                Ext.Msg.alert('Failed', action.result.msg);
            }
        });
    }
}

ExtJS - 从表单中获取值（基于登录应用程序教程）

1 个答案: