Sencha Touch 2 - How to get form values?

Question

I have a Sencha Touch 2 MVC application with a form in a view. I try to get these values ​​from the controller without success.

How can I do that? I am posting my view / controller code for this.

View:

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' } ] } }); 

And the controller:

 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"); } }); 

Code will grow to

 console.log("onSubmitLogin"); 

And then stop.

At startup, I use this:

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

So how can I get the values?

thanks

Answer 1

Ok Found the answer after some tweaking. For the sake of future generations - here is the solution:

I added id:'loginform' to LoginForm, and then in the controller in the 'refs' part I added loginForm: '#loginform' . Then I could use it like:

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

Good luck everyone

Answer 2

try it

Controller:

     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");
         }
     });

View:

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

I hope for this help.