无法使用sencha touch 2.1更改容器中标题栏的文本

时间:2013-07-29 10:06:03

标签: sencha-touch sencha-touch-2

我想创建一个用户登录和注销的应用程序。当用户登录时,系统会将用户信息(例如username,sessionid)存储到localstorage中,然后转到索引页面。索引页面左侧有一个带有用户名的标题栏和一个用于注销的按钮。但是当索引页面出现时用户登录时,它无法获取存储在本地存储中的数据。 我的代码如下:

索引页:

    Ext.define('MyApp.view.MyPanel', {
    extend : 'Ext.Panel',
    id : 'myPanel',
    config : {
        xtype : 'panel',
        layout : 'vbox',
        height : '100%',
        width : '100%',
        items : [ 
            {
                xtype : 'titlebar',
                docked : 'top',
                title : 'my panel',
                items : [ 
                    {   
                        align : 'left',
                        id : 'portal-username',
                        text : 'qq' //i used localStorage.getItem('userName') first,but not as good.
                    },   
                    {
                        align : 'right',
                        text : 'log out',
                        listeners : {
                            tap : function(){
                                var userName=null;var rememberPassword=null;var password=null;

                                if(userName=Ext.getCmp('userName'))userName.setValue('');
                                if(password=Ext.getCmp('password'))password.setValue('');
                                if(rememberPassword=Ext.getCmp('rememberPassword'))rememberPassword.setChecked(false);
                                //localstorage
                                localStorage.removeItem('userName','');
                                localStorage.removeItem('password','');
                                localStorage.removeItem('SessionId','');
                                localStorage.removeItem('rememberPassword','');


                                    var oldp=Ext.getCmp('loginPanel');if(oldp)oldp.destroy();
                                    var newActivePanel = Ext.create('MyApp.view.LoginPanel');
                                    Ext.Viewport.add(newActivePanel);
                                    Ext.Viewport.animateActiveItem(newActivePanel,{type:'slide',direction:'left'});
                            }
                        }
                    } 
                ]
            }
        ]
    }
});

登录面板的一部分:

                            items : [
                                    {
                                        xtype : 'button',
                                        text : 'login',
                                        ui : 'action',
                                        handler : function() {



                                            var userName = Ext.getCmp('userName').getValue();
                                            var password = Ext.getCmp('password').getValue();
                                            var rememberPassword = Ext.getCmp('rememberPassword').getChecked()+ '';

                                            if(!userName||!password){
                                                Ext.Msg.alert('prompt','login failure,try again!',Ext.emptyFn);
                                            }
                                            else Ext.Ajax.request({
                                                        url : remoteServer,
                                                        params : {
                                                            loginName: userName,
                                                            passWord : password,
                                                            SessionId : localStorage.getItem('SessionId');
                                                        },
                                                        method : 'POST',
                                                        callback : function(options,success,response) {
                                                            if (success) {
                                                                var result = Ext.JSON.decode(response.responseText.trim());
                                                                var status = result.status;
                                                                if (status == 'success') {
                                                                        if (rememberPassword == 'true')
                                                                            localStorage.setItem('rememberPassword',rememberPassword);

                                                                        localStorage.setItem('userName',userName);
                                                                        localStorage.setItem('password',password);
                                                                        localStorage.setItem('SessionId',result.SessionId);



                                                                        var oldp=Ext.getCmp('MyPanel');if(oldp)oldp.destroy();
                                                                        var newActivePanel = Ext.create('MyApp.view.MyPanel');
                                                                        Ext.Viewport.add(newActivePanel);
                                                                        Ext.Viewport.animateActiveItem(newActivePanel,{type:'slide',direction:'left'});

                                                                } else {
                                                                    localStorage.setItem('userName','');
                                                                    localStorage.setItem('password','');
                                                                    localStorage.setItem('JSessionId','');
                                                                    localStorage.setItem('rememberPassword','');


                                                                    Ext.Msg.alert('prompt','login failure,try again!',Ext.emptyFn);
                                                                }
                                                            } else {
                                                                Ext.Msg.alert('prompt','login failure,try again!',Ext.emptyFn);
                                                            }
                                                        }
                                                    });
                                        }
                                    }
                                ]

以下是我的控制器:

    Ext.define('MyApp.controller.MyController',
    {
        extend : 'Ext.app.Controller',
        id : 'MyController',
        config : {
            control : {
                MyPanel : {
                    show : 'panelActive'
                },
            },
            refs : {
                MyPanel : '#myPanel'
            }
        }//config
        ,panelActive : function(){
            Ext.getCmp('portal-username').setText(localStorage.getItem('userName'));
        }
});

1 个答案:

答案 0 :(得分:0)

跟随行

Ext.Viewport.animateActiveItem(newActivePanel,{type:'slide',direction:'left'});

登录处理函数中的

只需使用

设置用户名

Ext.getCmp('portal-username').setText(userName);