ExtJs4.0 登入執行個體

來源:互聯網
上載者:User

[javascript]
// JavaScript Document  
//載入提示框   
Ext.QuickTips.init();  
//建立命名空間   
Ext.namespace('Ext.ExtJs.Frame');  
//主應用程式   
Ext.ExtJs.Frame.app = function() { }  
//執行個體化程式  
Ext.extend(Ext.ExtJs.Frame.app, Ext.util.Observable, {  
    //程式頭部  
     AppTop:new Ext.Panel({  
            id: 'AppTopId',height: 35,frame:true,bodyStyle:'padding-top:4px',html:'<h3><center>Ext 4.0 Demo</center></h3>'  
                        }),  
    //登陸表單   
     AppMain: new Ext.form.FormPanel({  
            id: 'AppMainId',defaultType:'textfield',labelAlign:'right',labelWidth:60,bodyStyle:'text-align:center;',frame:true, 
            defaults:{allowBlank:false},  
            items:[{name:'Name',fieldLabel:'登陸帳號',blankText:'帳號不可為空',emptyText:'必填',anchor:'98%',bodyStyle:'margin-right:10px;'},  
                   {name:'Psd',inputType:'password',fieldLabel:'登陸密碼',blankText:'密碼不可為空',maxLength:10,anchor:'98%'}]  
                    }),  
    //登陸視窗   
      AppWin: new Ext.Window({width:250,height:150,closable:false,collapsible:false,resizable:false,  
        defaults:{border:false},buttonAlign:'center',buttons:[{ text:'關於',id:'about'},{text:'登陸',id:'login'}],layout:'column',  
           items:[{columnWidth:1,items:Ext.getCmp("AppTopId")},{columnWidth:1,items:Ext.getCmp("AppMainId")}]  
                    }),  
    //初始化   
    AppInit:function() {this.AppWin.show();}  
            });  
//程式入口    
Ext.onReady(function() {  
    AppFrame = new Ext.ExtJs.Frame.app();  
    AppFrame.AppInit();  
    //登陸按鈕事件  
    Ext.get('login').on('click',function(){Ext.Msg.alert('message','登入資訊中...');});  
    //關於按鈕事件  
    Ext.get('about').on('click',function(){Ext.Msg.alert('message','關於登入正在載入中....');});  
});  

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.