Extjs radio布局--横向排列

时间:2022-04-26
本文章向大家介绍Extjs radio布局--横向排列,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
  1 /**   
  2 
  3  * 出租车电召设计   
  4 
  5  * @author Don Quixote   
  6 
  7  * 20090407   
  8 
  9  * Hello,Don Quixote!   
 10 
 11  */    
 12 
 13 function ElectronicSummonPanel()     
 14 
 15 {     
 16 
 17     var self=this;     
 18 
 19     this.eleSummonPanel=new Ext.TabPanel({     
 20 
 21             autoTabs       : true,     
 22 
 23             activeTab      : 0,     
 24 
 25             deferredRender : false,     
 26 
 27             border         : false    
 28 
 29     });     
 30 
 31          
 32 
 33     this.dispatchPanel=new Ext.FormPanel({     
 34 
 35         title:'电召调度',     
 36 
 37         labelAlign: 'left',     
 38 
 39         frame:true,     
 40 
 41         bodyStyle:'padding:0px 0px 0',     
 42 
 43         width: '100%',     
 44 
 45         region:'center',     
 46 
 47         //labelWidth:70,     
 48 
 49         buttonAlign:'center',      
 50 
 51         items: [{     
 52 
 53             layout:'column',     
 54 
 55             id:'id_formPanelAddPosition'    
 56 
 57         }]     
 58 
 59     });     
 60 
 61     this.reserveListPanel={     
 62 
 63         title:'预约列表',     
 64 
 65         html:'tb2'    
 66 
 67     };     
 68 
 69         //调度方式     
 70 
 71         var dispatchModel={     
 72 
 73                 columnWidth:1,     
 74 
 75                 layout: 'form',     
 76 
 77                 items: [{     
 78 
 79                         xtype: 'panel',     
 80 
 81                         layout: 'table',     
 82 
 83                         fieldLabel: '调度模式',     
 84 
 85                         defaultType: 'radio',     
 86 
 87                         isFormField: true,     
 88 
 89                         items: [{     
 90 
 91                         name: 'prjPermissionCode', //这里加入name表示两个radio属于同一个组,形成单选模式,如果不加name或者两个name不一样,则会发生两个都会选择的情况     
 92 
 93                         boxLabel: '即时调度',     
 94 
 95                         value: '1',     
 96 
 97                         checked:true    
 98 
 99                         },{     
100 
101                         name: 'prjPermissionCode',     
102 
103                         boxLabel: '预约调度',     
104 
105                         value: '2'    
106 
107                         }]     
108 
109                 }     
110 
111                     ]                
112 
113         }    
114 
115     this.formPanelAddPosition=Ext.getCmp("id_formPanelAddPosition");     
116 
117     this.formPanelAddPosition.add(dispatchModel);     
118 
119          
120 
121     this.eleSummonPanel.add(self.dispatchPanel);     
122 
123     this.eleSummonPanel.add(self.reserveListPanel);     
124 
125     this.eleSummonWindow_InControlPanel=new Ext.Window({     
126 
127             title:'出租车电召',     
128 
129             layout:'fit',     
130 
131             width:500,     
132 
133             height:300,     
134 
135             closeAction:'hide',     
136 
137             plain:true    
138 
139     });     
140 
141     this.eleSummonWindow_InControlPanel.add(self.eleSummonPanel);     
142 
143     this.eleSummonWindow_InControlPanel.show();     
144 
145 }