ExtJS学习日记<2>

9、窗口基本应用
      
            var i=0;
            function newWin(){
              var win = new Ext.Window({
                  title:"窗口"+i++,
                  width:400,
                  height:300,
                  maximizable:true
              });
              win.show();
            }
          Ext.onReady(function(){
             Ext.get("btn").on("click",newWin)
          });
        

10、窗口分组
     
            var i=0;
            function newWin(){
              var win = new Ext.Window({
                  title:"窗口"+i++,
                  width:400,
                  height:300,
                  maximizable:true,
                  manager:mygroup
              });
              win.show();
            }
            function toBack(){
              mygroup.sendToBack(mygroup.getActive());
            }
            function hideAll(){
              mygroup.hideAll();
            }
          Ext.onReady(function(){
             mygroup = new Ext.WindowGroup();
             Ext.get("btn").on("click",newWin);
             Ext.get("btnToBack").on("click",toBack);
             Ext.get("btnHide").on("click",hideAll);
          });
        
   
   
   
11、对话框
        Ext的对话都封装在Ext.MessageBox类，该类还可以简写Ext.Msg

           Ext.onReady(function(){
               Ext.get("btnAlert").on("click",function(){
                  Ext.MessageBox.alert("请注意","这里是ExtJS的提示框");
               });
           });
        
        
12、Ext.MessageBox除了alert外，Ext还包含confirm,prompt,progress,wait等对话框
        
   Ext.onReady(function(){
       Ext.get("btn").on("click",function(){
          Ext.MessageBox.confirm("请确认","是否真的要删除指定的内容",function(button,text){
      alert(button);
      alert(text);
   });
       });
   });

  
  
           Ext.onReady(function(){
           Ext.get("btn").on("click",function(){
              Ext.MessageBox.confirm("请确认","是否真的要删除指定的内容",function(button,text){
             if(button=="yes"){
                 alert("删除成功");
              }
             if(button=="no"){
                 alert("删除不成功");
             }
           });
           });
        });
        

     Ext.onReady(function(){
      Ext.get("btn").on("click",function(){
        Ext.MessageBox.prompt("输入提示框","请输入你新年愿望:",function(button,text){
           if(button=="ok"){
             alert("你新年的愿望是:"+text);
           }
           else alert("你放弃了录入");
        });
       });
     });
        
13、layout布局
        
     Ext.onReady(function(){
        new Ext.Panel({
           renderTo:"hello",
           width:400,
           height:200,
           layout:"column",
           items:[{columnWidth:.5,title:"面板1"},
                  {columnWidth:.5,title:"面板2"}]
        });
     });
        
14、Border区域布局
        
     Ext.onReady(function(){
        new Ext.Viewport({
           layout:"border",
           items:[{region:"north",
                   height:100,
                   title:"顶部面板"},
                  {region:"south",
                   height:50,
                   titl:"底部面板"},
                  {region:"center",
                   title:"中央面板"},
                  {region:"west",
                   width:100,
                   title:"左边面板"},
                  {region:"east",
                   width:100,
                   title:"右边面板"} ]
        });
     })
        

 

 

                                                                                                    (来源：http://www.iomo.cn)