Sencha Touch 2 - 如何获取表单数值？

Question

我有一个使用Sencha Touch 2 MVC框架的应用程序，其中包含一个表单视图。

我试图从控制器中获取该表单的值，但没有成功。

请问如何实现？以下是我的视图/控制器代码：

视图：

Ext.define('MyApp.view.LoginForm', {
    extend: 'Ext.form.Panel',
    config: {
        fullscreen: true,
        items: [
            {
                xtype: 'fieldset',
                title: 'Login',
                id: 'loginform',
                items: [
                    {
                        xtype: 'emailfield',
                        name: 'email',
                        label: 'Email'
                    },
                    {
                        xtype: 'passwordfield',
                        name: 'password',
                        label: 'Password'
                    }
                ]
            },
            {
                xtype: 'button',
                width: '50%',
                text: 'Login',
                ui: 'confirm',
                id: 'btnSubmitLogin'
            },
            {
                xtype: 'toolbar',
                docked: 'top',
                title: 'MyApp Mobile'
            }
        ]
    }
});

还有控制器：

Ext.define("MyApp.controller.LoginForm", {
    extend: "Ext.app.Controller",
    config: {
        refs: {
            btnSubmitLogin: "#btnSubmitLogin"
        },
        control: {
            btnSubmitLogin: {
                tap: "onSubmitLogin"
            }
        }
    },
    onSubmitLogin: function () {
        console.log("onSubmitLogin");
        var values = app.views.LoginForm.loginform.getValues();
        TryLogin(values['email'], values['password']);
    },
    launch: function () {
        this.callParent();
        console.log("LoginForm launch");
    },
    init: function () {
        this.callParent();
        console.log("LoginForm init");
    }
});

代码将一直执行到

。

console.log("onSubmitLogin");

然后停止。

启动时我使用以下代码：

var LoginForm = Ext.create("MyApp.view.LoginForm");
Ext.Viewport.add(LoginForm);

所以，我怎样才能获得这些值？谢谢。

- Roman

Answer 1

好的。 经过一些调整后，我找到了答案。为了后代子孙-这是解决方案：

我在LoginForm中添加了id：'loginform'，然后在控制器的'refs'部分中添加了loginForm：'#loginform'。然后我可以这样使用它:

var values = this.getLoginForm().getValues();

祝大家好运

- Roman

---

感谢您发布解决方案！它对我非常有帮助。 - Matt McClure

Answer 2

试试这个

控制器：

    Ext.define("mySIMS.controller.LoginForm", {
        extend : "Ext.app.Controller",
        config : {
            refs : {
                btnSubmitLogin : "#btnSubmitLogin",
                LoginForm : '#loginform'
            },
            control : {
                btnSubmitLogin : {
                    tap : "onSubmitLogin"
                }
            }
        },
        onSubmitLogin : function() {
            console.log("onSubmitLogin");
            var values = this.getLoginForm().getValues();
            console.log(values);
//var values = Oreilly.views.LoginForm.loginform.getValues();
},
        launch : function() {
            this.callParent();
            console.log("LoginForm launch");
        },
        init : function() {
            this.callParent();
            console.log("LoginForm init");
        }
    });

视图：

Ext.define('mySIMS.view.LoginForm', {
    extend: 'Ext.form.Panel',
    config: {
        id: 'loginform',
        fullscreen: true,
        items: [{
            xtype: 'fieldset',
            title: '登录',
            items: [{
                xtype: 'emailfield',
                name: 'email',
                label: '电子邮件'
            }, {
                xtype: 'passwordfield',
                name: 'password',
                label: '密码'
            }]
        }, {
            xtype: 'button',
            width: '8%',
            text: '登录',
            ui: 'confirm',
            id: 'btnSubmitLogin'
        }, {
            xtype: 'toolbar',
            docked: 'top',
            title: '移动端'
        }]
    }
});
希望这可以帮到您。

- wdragon

---

请更详细地描述您的解决方案。参考：如何回答问题。 - askmish