`
wang19841229
  • 浏览: 95365 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

EXT学习笔记06下combox

    博客分类:
  • ajax
阅读更多

combox是EXT.form中最复杂的。<script>

			Ext.onReady(function(){
					new Ext.Window({
						modal:true,
						title:'添加用户',
						resizable:false,
						width:500,
						layout:'form',
						bodyStyle: 'padding:5px 5px 0',
						labelWidth:60,
						height:240,
						plain:true,
						buttonAlign:'center',  
						items:[{
							baseCls:'x-plain',
							layout:'column',
							items:[{
								 labelWidth:60,
								 layout:'form',
								 baseCls:'x-plain', 
								 columnWidth:.5,	 	
								 defaultType:'textfield',
								 items:[{
								 	fieldLabel:"姓名"
								 },{
								 	fieldLabel:"性别",
									xtype:"combo",
									width:130,
									readOnly:true,
									mode:"local",
									displayField:"sex",
									triggerAction:"all",
									value:"男",
									store:new Ext.data.SimpleStore({
										fields:["sex"],
										data:[["男"],["女"]]
									})
								 },{
								 	xtype:"datefield",
									format:"Y-m-d",
									readOnly:true,
								 	fieldLabel:"出生日期",
									width:130
								 },{
								 	fieldLabel:"地址"
								 }]
								   
							},{
								baseCls:'x-plain',
								labelWidth:60,
								layout:'form',
								columnWidth:.5,
								defaultType:'textfield',
								items:[{
									fieldLabel:"照片",
									inputType :"image",
									width:120,
									height:100 
								}]	
							}]							
						},{
							xtype:'textfield',
							fieldLabel:"详细地址",
							width:410
						},{
							xtype:'textfield',
							fieldLabel:"关系",
							width:410
						}],
						buttons:[{text:"确定"},{text:"取消"}],
						listeners:{
							"show":function(_window)
							{
								
								_window.findByType('textfield')[4].getEl().dom.scr="a.gif";
								
							}
						}  
					}).show();
			});
			
		</script>

   属性

  xtype:这个UI的xtype是combo

  readOnly:只读

  mode:模式这个很重要默认这个UI的数据是从服务器上请求,但是如果使用本地数据需要使用local

  triggerAction:这个属性也有意思。combox默认选中一个选项之后在点下拉列表只能选择刚才选择的解决办法是把这   个属性设为all。

value:默认值

最复杂的两个属性

displayField:显示的场所。这个属性是设定为store属性指定的数据提供原的fields一样的。

store:数据提供原:可以使用data包下的store结尾的类。我们用SimpleStore类实现,这个类只是本地数据。

           fields:属性与combox中的displayField属性对应。

           data:数据数组形式例如:[["男"],["女"]]

  • 大小: 9.8 KB
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics