Sencha Touch MVC :: Trying to reach getValues() of Ext.extend(Ext.form.FormPanel,...)

Question

i am trying to reach the values of my form in my sencha touch application which i build out of a patchwork of tutorials. i want it to be a MVC pattern app so i use

app.views.Login = Ext.extend(Ext.form.FormPanel, formBase = {...})

and inside there initialising it with

 app.views.Login.superclass.initComponent.apply(this, arguments);

and a viewport like in the sencha touch phonegap MVC tutorial (link) where I apply the login page like

Ext.apply(app.views, {loginPage: new app.views.Login()});

within my app when I click the send button of the form I try to catch the fields of the form

handler: function() {
    console.log('username ', app.views.Login.getValues().username);
    Ext.Ajax.request({
        url: app.views.Login.url,
        method: 'POST',
        params: {username: form.getValues().username, password : form.getValues().password},
        failure : function(response){
                    console.log('Login Error! ' + response.responseText);
                },
        success: function(response, opts) {
                    console.log('Login success! response: ' + response.responseText);
                  }
    });
}

but I allways get an error which says

Uncaught TypeError: Cannot call method 'getValues' of undefined"

when i use

console.log('username ', this.getValues().username);

so how could I reach the form values?

thnx!!!

Answer 1

Looking at Sencha Touch API Documentation, I do not see a method getForm(), but getValues() should be reachable like this from your button handler function:

app.views.loginPage.getValues();