Kann keine Schaltfläche zu einem Panel hinzufügen extJS

Question

Ich habe seltsames Problem. Ich hatte eine einfache Sicht, die gut zeigte, sobald ich versuche, eine Schaltfläche hinzuzufügen und zu versuchen, meine Web-App zu öffnen, wird nichts angezeigt, hier ist der relevante Code, kann jeder sehen, was damit nicht stimmt?

/** 
* This class is the main view for the application. It is specified in app.js as the 
* "autoCreateViewport" property. That setting automatically applies the "viewport" 
* plugin to promote that instance of this class to the body element. 
* 
* TODO - Replace this content of this view to suite the needs of your application. 
*/ 
Ext.define('Myapp.view.main.Main', { 
    extend: 'Ext.container.Container', 
    requires: [ 
     'Myapp.view.main.MainController', 
     'Myapp.view.main.MainModel' 
    ], 

    xtype: 'app-main', 

    controller: 'main', 


    items: [ 
     { 
      xtype: 'panel', 
      title: 'Child Panel 1', 
      height: 100, 
      columnWidth: 0.5, 
      items: [ 
      { 
       xtype: 'button', 
       text: 'Create', 
       itemId: 'createStudentID', 
       handler: onClickButton 
      }] 

     }, 
     { 
      xtype: 'panel', 
      title: 'Child Panel 2', 
      height: 100, 
      columnWidth: 0.5 
     } 
    ] 
}); 

Controller:

/** 
* This class is the main view for the application. It is specified in app.js as the 
* "autoCreateViewport" property. That setting automatically applies the "viewport" 
* plugin to promote that instance of this class to the body element. 
* 
* TODO - Replace this content of this view to suite the needs of your application. 
*/ 
Ext.define('Myapp.view.main.MainController', { 
    extend: 'Ext.app.ViewController', 

    requires: [ 
     'Ext.window.MessageBox' 
    ], 

    alias: 'controller.main', 

    onClickButton: function() { 
     Ext.define('Student', 
     { 
      name: 'unnamed', 

      getName: function() { 
       return "Student name is" + this.name; 
      } 
     }); 

     var studentObj = Ext.create('Student'); 
     studentObj.getName(); 
    } 


}); 

Ich bin wirklich verwirrt. Wenn ich entfernen Knopf und seine Handler kann ich meine beiden Platten

Answer 1

durch Änderung Handler Zuhörer

items: [ 
     { 
      xtype: 'panel', 
      title: 'Child Panel 1', 
      height: 100, 
      columnWidth: 0.5, 
      items: [ 
      { 
       xtype: 'button', 
       text: 'Create', 
       itemId: 'createStudentID', 
       listeners: { 
        click: 'onClickButton' 
       } 
      }] 

     }, 

Answer 2

Sie sollten die Browserkonsole öffnen gelöst sehen, was Sie, dass

onClickButton is undefined 

Solche erzählen eine Fehlermeldung wäre für den Leser ... oder für Sie nützlich.