Results 1 to 2 of 2

Thread: mvc cannot find contorl on undefined error

  1. #1

    Default mvc cannot find contorl on undefined error

    Uncaught TypeError: Cannot call method 'control' of undefined

    I am concatenating the script files and am getting above message..

    Attached is the file...any help is greatly appreciated...



    Ext.define('registration.view.LoginPanel', {
    extend: 'Ext.Panel',
    alias: 'widget.loginpanel',
    layout: {
    type: 'border'
    },
    region:'north',
    height: 70,
    bodyStyle: {
    background: '#333366'
    },
    border: false,
    constructor: function(config) {
    config = config || {};
    Ext.apply(this.initialConfig, config);
    Ext.apply(this, config);

    this.titlePanel = new Ext.Panel({
    region:'west',
    width: 150,
    layout: {
    type: 'hbox',
    align: 'middle',
    pack:'end',
    padding: 30
    },
    bodyStyle: {
    background: '#333366'
    },
    border:false,
    items: [{
    xtype: 'box',
    autoEl: {tag: 'label', html:'HelloWorld', style:"color:white;background-color:#333366;font-family:tahoma, arial, helvetica, sans-serif; font-size:18px; font-style:bold; font-variant:normal; font-weight:normal"}
    }]
    });

    this.fieldPanel = new Ext.Panel({
    layout:'fit',
    region:'center',
    layout: {
    type: 'hbox',
    pack: 'end',
    align: 'stretch'
    },
    bodyStyle: {
    background: '#333366'
    },
    border:false
    });

    var userIDLabel = this.userIDLabel ={
    xtype: 'box',
    autoEl: {tag: 'label', href: 'javascript: registration.views.FooterPanel.showAbout()', html:'Email', style:"color:white;background-color:#333366;font-family:tahoma, arial, helvetica, sans-serif; font-size:12px; font-style:normal; font-variant:normal; font-weight:normal"}
    }
    var userIDField = this.userIDField = new Ext.form.TextField({
    name: 'Email',
    width: 100,
    height: 20,
    flex:1
    });
    var passwordLabel = this.passwordLabel = {
    xtype: 'box',
    autoEl: {tag: 'label', href: 'javascript: registration.views.FooterPanel.showAbout()', html:'Password', style:"color:white;background-color:#333366;font-family:tahoma, arial, helvetica, sans-serif; font-size:12px; font-style:normal; font-variant:normal; font-weight:normal"}
    }
    var passwordField = this.passwordField = new Ext.form.TextField({
    name: 'Password',
    height:20,
    flex:1
    });
    var emptyLabel = this.emptyLabel = new Ext.form.Label({
    text:'Forgot Password?'
    });
    var loginButton = this.loginButton = new Ext.Button({
    text: 'Sign In',
    width: 45,
    height: 20,
    flex: 1
    });
    this.loginButton.on('click', this.loginClickListener.bind(this));

    registration.view.LoginPanel.superclass.constructor.apply(this, arguments);

    var uPanel = new Ext.Panel({
    width:200,
    padding:10,
    layout: {
    type: 'vbox',
    align:'stretch',
    pack:'start'
    },
    border: false,
    items:[
    userIDLabel,
    userIDField
    ],
    bodyStyle: {
    background:'#333366'
    }
    });

    var pPanel = new Ext.Panel({
    width:200,
    padding: 10,
    layout: {
    type: 'vbox',
    align:'stretch',
    pack:'start'
    },
    border: false,
    bodyStyle: {
    background:'#333366'
    },
    items:[
    passwordLabel,
    passwordField
    ]
    });

    var btnPanel = new Ext.Panel({
    width:140,
    layout: {
    type: 'vbox',
    align:'middle',
    pack:'start',
    padding: '25 25 25 5'
    },
    border: false,
    bodyStyle: {
    background:'#333366'
    },
    items:[loginButton]
    });

    var formPanel = this.formPanel = new Ext.form.FormPanel({
    layout: {
    type: 'hbox',
    pack: 'end',
    align: 'stretchmax'
    },
    width: 800,
    padding: 10,
    labelWidth:70,
    labelAlign: 'top',
    bodyStyle: {
    background: '#333366'
    },
    flex: 1,
    border: false,
    items: [uPanel, pPanel, btnPanel],
    flex:1

    });

    this.fieldPanel.add(formPanel);
    this.add(this.titlePanel);
    this.add(this.fieldPanel);
    },
    initComponent: function() {
    this.callParent(arguments);
    },
    getForm: function() {
    var form = this.formPanel.getForm();
    return form;
    },
    setErrorMessage: function(message) {

    },
    loginClickListener: function() {
    console.log('asdfa');
    //this.loginController.login();
    this.fireEvent('login');

    },
    loginFailureCallback: function(message) {

    }
    });








    Ext.define('registration.view.RegistrationPanel', {
    extend: 'Ext.Panel',
    alias: 'widget.registrationpanel',
    layout: {
    type: 'hbox',
    pack: 'end',
    align: 'stretchmax',
    padding: '20 20 20 250',
    margins: 10
    },
    bodyStyle: {
    background: '#ffbb11'
    },
    region: 'center',
    border: true,
    constructor : function(config) {
    config = config || {};

    Ext.apply(this, config);
    Ext.apply(this.initialConfig, config);

    var firsNameField = this.firstNameField = Ext.create('Ext.form.field.Text', {
    fieldLabel: 'First Name',
    labelAlign: 'top',
    name: 'FirstName',
    width: 250
    });

    var lastNameField = this.lastNameField = Ext.create('Ext.form.field.Text', {
    fieldLabel: 'Last Name',
    labelAlign: 'top',
    name: 'LastName',
    width: 250
    });

    var emailField = this.emailField = Ext.create('Ext.form.field.Text', {
    fieldLabel: 'Email',
    labelAlign: 'top',
    name: 'Email',
    width: 250
    });

    var passwordField = this.passwordField = Ext.create('Ext.form.field.Text', {
    fieldLabel: 'Password (6 or more characters)',
    labelAlign: 'top',
    name: 'Password',
    inputType: 'password',
    width: 250
    });

    this.registerButton = new Ext.Button({
    text: 'Submit'
    });

    registration.view.RegistrationPanel.superclass.constructor.apply(this, arguments);

    var formPanel = this.formPanel = Ext.create('Ext.form.Panel', {
    title: 'Register with HelloWorld',
    labelAlign: 'top',
    labelWidth:70,
    height: 350,
    width: 530,
    bodyStyle: {
    background: '#ffbb11'
    },
    border: false
    });

    formPanel.add({type:'spacer', height:15, border: false,bodyStyle: {
    background: '#ffbb11'
    }});
    formPanel.add(this.firstNameField);
    formPanel.add({type:'spacer', height:15, border: false,bodyStyle: {
    background: '#ffbb11'
    }});
    formPanel.add(this.lastNameField);
    formPanel.add({type:'spacer', height:15, border: false,bodyStyle: {
    background: '#ffbb11'
    }});
    formPanel.add(this.emailField);
    formPanel.add({type:'spacer', height:15, border: false,bodyStyle: {
    background: '#ffbb11'
    }});
    formPanel.add(this.passwordField);
    formPanel.add({type:'spacer', height:20, border: false,bodyStyle: {
    background: '#ffbb11'
    }});

    this.registerButton.on('click', this.registrationClickListener.bind(this));

    this.formPanel.add(this.registerButton);

    this.add(this.formPanel);
    },
    setController: function (controller) {
    this.controller = controller;
    },
    getForm: function () {
    var form = this.formPanel.getForm();
    return form;
    },
    registrationClickListener: function () {
    //this.controller.register();
    this.fireEvent('register');
    }


    });






    Ext.define('registration.view.FooterPanel', {
    extend: 'Ext.Panel',
    alias: 'widget.footerpanel',
    region: 'south',
    height: 20,
    layout: {
    type: 'hbox',
    pack: 'center',
    align: 'stretchmax'
    },
    bodyStyle: {
    background: '#333366'
    },
    border: false,

    constructor: function(config) {
    config = config || {};

    Ext.apply(this, config);
    Ext.apply(this.initialConfig, config);

    registration.view.FooterPanel.superclass.constructor.apply(this, arguments);

    this.add({
    xtype: 'box',
    autoEl: {tag: 'a', href: 'javascript: registration.views.FooterPanel.showAbout()', html:'About', style:"color:white;background-color:#333366;font-family:tahoma, arial, helvetica, sans-serif; font-size:12px; font-style:normal; font-variant:normal; font-weight:normal"}
    });
    this.add({type:'spacer', width:15, border: false,bodyStyle: {
    background: '#333366'
    }});
    this.add({
    xtype: 'box',
    autoEl: {tag: 'a', href: 'javascript: registration.views.FooterPanel.showAbout()', html:'Help', style:"color:white;background-color:#333366;font-family:tahoma, arial, helvetica, sans-serif; font-size:12px; font-style:normal; font-variant:normal; font-weight:normal"}
    });
    this.add({type:'spacer', width:15, border: false,bodyStyle: {
    background: '#333366'
    }});
    this.add({
    xtype: 'box',
    autoEl: {tag: 'a', href: 'javascript: registration.views.FooterPanel.showAbout()', html:'User Agreement', style:"color:white;background-color:#333366;font-family:tahoma, arial, helvetica, sans-serif; font-size:12px; font-style:normal; font-variant:normal; font-weight:normal"}
    });
    this.add({type:'spacer', width:15, border: false,bodyStyle: {
    background: '#333366'
    }});
    this.add({
    xtype: 'box',
    autoEl: {tag: 'a', href: 'javascript: registration.views.FooterPanel.showAbout()', html:'Privacy', style:"color:white;background-color:#333366;font-family:tahoma, arial, helvetica, sans-serif; font-size:12px; font-style:normal; font-variant:normal; font-weight:normal"}
    });
    this.add({type:'spacer', width:15, border: false,bodyStyle: {
    background: '#333366'
    }});
    this.add({
    xtype: 'box',
    autoEl: {tag: 'a', href: 'javascript: registration.views.FooterPanel.showAbout()', html:'Copyright', style:"color:white;background-color:#333366;font-family:tahoma, arial, helvetica, sans-serif; font-size:12px; font-style:normal; font-variant:normal; font-weight:normal"}
    });
    this.add({type:'spacer', width:15, border: false,bodyStyle: {
    background: '#333366'
    }});
    },
    initComponent: function() {
    registration.view.FooterPanel.superclass.initComponent.call(this, arguments);
    },
    showAbout: function () {
    alert('About');
    }
    });


    /**
    * The main application viewport, which displays the whole application
    * @extends Ext.Viewport
    */
    Ext.define('registration.view.Viewport', {
    extend: 'Ext.Viewport',
    layout: 'border',

    requires: [
    'registration.view.LoginPanel',
    'registration.view.RegistrationPanel',
    'registration.view.FooterPanel'
    ],

    initComponent: function() {
    var loginPanel = {xtype: 'loginpanel'};//Ext.create('registration.view.LoginPanel');
    var registrationPanel = {xtype:'registrationpanel'};// Ext.create('registration.view.RegistrationPanel');
    var footerPanel = {xtype:'footerpanel'};//Ext.create('registration.view.FooterPanel');

    var me = this;

    Ext.apply(me, {
    items: [loginPanel, registrationPanel, footerPanel]
    });

    me.callParent(arguments);
    }
    });


    Ext.define('registration.controller.LoginController', {
    extend: 'Ext.app.Controller',

    views: ['LoginPanel'],

    refs: [
    { ref: 'loginPanel', selector: 'loginpanel'}
    ],

    constructor: function() {

    },

    init: function () {
    var me = this;
    console.log('halsl');
    },

    onLaunch: function () {
    console.log('test');
    var me = this;

    me.control('loginPanel', {
    login: function() { console.log('test12');}
    });
    },

    login: function() {
    console.log('asdfasdf');
    var form = this.getLoginPanel().getForm();

    form.submit({
    url:'/DataServer/jsp/login.action',
    success: function(form, action) {
    try {
    var response = Ext.util.JSON.decode(action.response.responseText);

    if (!response['loginSuccess']) {
    if (response['errorMessage']) {
    Ext.Msg.alert(response['errorMessage']);
    }
    else {
    Ext.Msg.alert('Error signing in');
    }
    }
    else {
    var userConsoleURL = window.location.protocol+'//'+window.location.host+'/ps/jsp/userConsole.jsp';
    window.location.replace(userConsoleURL);
    }

    } catch (e) {}
    //var userConsoleURL = window.location.protocol+'//'+window.location.host+'/ps/jsp/userConsole.jsp';
    //window.location = userConsoleURL;
    },
    failure: function(form, action) {
    switch(action.failureType) {
    case Ext.form.Action.CLIENT_INVALID:
    Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
    break;
    case Ext.form.Action.CONNECT_FAILURE:
    Ext.Msg.alert('Failure', 'Ajax communication failed');
    break;
    case Ext.form.Action.SERVER_INVALID:
    Ext.Msg.alert('Failure', action.result.msg);
    }
    }
    });
    },
    register: function() {
    var form = this.getRegistrationPanel().getForm();


    form.submit({
    url:'/DataServer/jsp/register.action',
    success: function(form, action) {
    Ext.Msg.alert('Success', action.result.message);
    },
    failure: function(form, action) {
    switch(action.failureType) {
    case Ext.form.Action.CLIENT_INVALID:
    Ext.Msg.alert('Failure', 'Form fields may not be submitted with invalid values');
    break;
    case Ext.form.Action.CONNECT_FAILURE:
    Ext.Msg.alert('Failure', 'Ajax communication failed');
    break;
    case Ext.form.Action.SERVER_INVALID:
    Ext.Msg.alert('Failure', action.result.message);
    }
    }
    });
    }
    });




    Ext.application({
    name: 'registration',

    /*requires: ['Ext.container.Viewport'],

    models: ['Credentials'],

    views: ['LoginPanel', 'RegistrationPanel'],*/

    controllers: ['LoginController'],

    autoCreateViewport: true

    /*launch: function () {
    var loginPanel = {xtype: 'loginpanel'};//Ext.create('registration.view.LoginPanel');
    var registrationPanel = {xtype:'registrationpanel'};// Ext.create('registration.view.RegistrationPanel');
    var footerPanel = {xtype:'footerpanel'};//Ext.create('registration.view.FooterPanel');

    //var loginController = this.loginController = new registration.controllers.LoginController(loginPanel, registrationPanel);

    Ext.create('Ext.container.Viewport',{
    layout: 'border',
    items:[loginPanel, registrationPanel, footerPanel],
    border: false
    });
    }*/
    });

  2. #2

    Default Resolved.

    controller was overriding constructor (leftover from 3.x ; had created classes similar to 4.0)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •