EXT 학습노트06 combox

2698 단어 UIext
combox는 EXT.form 중 가장 복잡합니다.
			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을 사용해야 합니다.
trigger Action: 이 속성도 재미있어요.combox 기본적으로 옵션을 선택한 후 점 밑에 있는 목록에서 방금 선택한 해결 방법만 선택할 수 있습니다. 이 속성을 all로 설정하는 것입니다.
value: 기본값
가장 복잡한 두 가지 속성
displayField: 표시되는 장소입니다.이 속성은store 속성에 지정된 데이터로 원래fields를 제공하는 것과 같습니다.
store: 데이터 제공원: 데이터 패키지에 있는store로 끝나는 클래스를 사용할 수 있습니다.우리는 SimpleStore 클래스로 이루어진다. 이 클래스는 로컬 데이터일 뿐이다.
fields: 속성은combox의displayField 속성과 대응합니다.
데이터: 데이터 그룹 형식: [["남자"], ["여자"]]

좋은 웹페이지 즐겨찾기