button - 按钮单击操作以使用 extjs 4 关闭视图

Question

当我单击连接按钮时，我有一个登录表单，我想转到另一个视图并关闭登录视图。

它是我的源代码：

登录视图

Ext.define('Ext4Example.view.login.LoginForm' ,{
 extend: 'Ext.form.FormPanel',
alias : 'widget.login',

bodyStyle: "background-image:url('resources/images/logo.png')",
margin: '100 50 10 450',
width:500,
height:320,
frame: true,
initComponent: function() {
this.items= [{
    xtype: 'textfield',
    name : 'id',
    fieldLabel: 'id',
    hidden:true
},
{
        xtype: 'textfield',
        x:100,
        y:100,
        cls:'user',
        emptyText : "votre nom d'utilisateur...",
        fieldLabel:"Nom d'utilisateur",
        name:'j_username',



    },{
        xtype: 'textfield',
        x:100,
        y:100,
        emptyText : "votre mot de passe...",
         name:'j_password',
        fieldLabel:'Mot de passe'

    },

     {
             xtype: 'checkbox',
            boxLabel: 'Rester connecte',
            x:100,
            y:110,
            allowBlank: false},
            {xtype: 'button',
                text:'Connexion',
                action: 'connect',

                margin:'120 0 0 170',
                name:'connect'
            },


                {xtype: 'button',
                    margin:'120 20 0 20',
                    text:' Annuler ',
                    action: 'reset',
                        name:'reset',

                },
            {
                xtype: 'tbtext',
                text: 'Copyright ©  Tous droits réservés',
                margin: '64 0 0 58',

              }
    ],
this.callParent(arguments);
}


});    

家庭视图

Ext.define('Ext4Example.view.login.HomePage' ,{
extend: 'Ext.container.Viewport',

alias : 'widget.home',

requires: [
           'Ext4Example.view.login.WestMenu',
           'Ext4Example.view.login.CenterPanel'

       ],
       layout: {
           type: 'border',
           padding: '0 5 5 5'
       },

initComponent: function() {


this.items= [

    {

    xtype: 'westmenu',
    region: 'west'
},{

    xtype: 'portletpanel',
    region: 'center',
}
],

    this.callParent(arguments);
}
});    

我的控制器

Ext.define('Ext4Example.controller.Login', {
extend: 'Ext.app.Controller',

stores: ['Login'],

models: ['Login'],

views: ['login.LoginForm','login.HomePage','login.CenterPanel','login.WestMenu'],


init: function() {


    this.control({
        'login button[action=add]': {  

        },

        'login button[action=reset]': {  
            'click' : function(button, event, opt) {  

                var form = button.up('form');
                form.getForm().reset();
            }  
        },

        'login button[action=connect]': {  

            'click' :this.connect
        }
    });
 },
 connect:function(button,record) 
{

var view1 = Ext.widget('home');


}

});

当我单击按钮连接时，我在同一页面上看到了两个视图，但我希望登录视图消失，只有我想显示主视图。

有人有解决方案吗？

Answer 1

尝试：

var win = button.up('login');
win.close();