I am very new to Sencha Touch and I'm trying to develop an app which includes a user registration view and a user login view.
The main view has a login button and a registration button.
What I am trying to accomplish is to change views in response to the buttons being tapped.
The following is the code I am using:
Ext.define('MyApp.controller.RegisterForm', {
extend: 'Ext.app.Controller',
requires: ['Ext.data.JsonP'],
config: {
refs: {
mainPage: 'mainpage',
loginForm: 'loginform',
registerForm: 'registerform'
},
control: {
'button[action=UserNewAccount]': {
tap: 'onNewAccount'
},
}
},//config
/**
* respond when new account is requested
*/
onNewAccount: function(event){
/**
* I have tried this ...
*/
this.getLoginForm().add(this.getRegisterForm());
this.getLoginForm().setActiveItem(this.getRegisterForm());
/**
* ... and this
*/
this.getLoginForm().setActiveItem({
xtype: 'registerform'
});
console.log('New account requested: ');
}
});
The onNewAccount function responds just fine. The console.log call executes. The problem is the code above that. I've tried those two different approaches with no success.
What am I doing wrong, and how can I achieve my change of views?
It seems the registerform is not a child component of your loginform. You must call the setActiveItem
from the parent container.
this.getMainPage().setActiveItem(this.getRegisterForm());