LearningExtJS_newのForm類学習(一)

//       Form  
	
	//1.          xtype 
	//2.          allowBlank:false,disabledDays:[1,2,3,4]
	//3.   vtype     Ext.form.vtypes 
	//4.         Ext.QuickTips.init();
	//5.      vtype  ,  mask             .
		//           ,1>   + Val          
//							   2>   + Mask           
//							   3>   + Text           
//							   4>   = function       
	//6.radioButton , checkBoxButton   checkBox button
	//7.combobox       
		//           local:true
//		  1>        mode:local  ture,       
//		  2>   displayField:  ,        
//		  3>triggerAction    ,       
		//          
//		  1>   url    ,   json  
//		  2>       autoLoad:true,    store  load    ,       
	
	//8.textArea  HTMLEditor
	//HTMLEditor             (Ext.QuickTips.init();)    ,        
	
	//9.form    .
	//textField,combobox  ,   listeners:{}    ,           ,    API event
	
	//10.     
	//      movieForm.getForm().submit ,  success  failture   ,      success:boolean
	//   .            .                    .
	
	//11.     ....
	//1.      
	//   movieForm.getForm().findField("txtDirector").setValue("Jimjackson");    ,         
	//2.      
	// movieForm.getForm().load({url:"",params{}});  url    ,       success   data  : 
	//{"data":{"txtDescription":"Test<\/B>","txtTitle":"Jack"},"success":true}


	//       
	Ext.QuickTips.init();
	
	//    vtype                 ,       
	Ext.form.VTypes["nameVal"] = /^[A-Z]+[a-zA-Z]+$/;
	Ext.form.VTypes["nameMask"] = /^[a-zA-Z]$/;
	Ext.form.VTypes["nameText"] = "     ,      !";
	Ext.form.VTypes["name"] = function(value){
								return Ext.form.VTypes["nameVal"].test(value);
							};
	//       combobox
	//     store       
	var localData = [["1","  "],["2","  "],["3","   "]];
	var localStore = new Ext.data.SimpleStore({
						data:localData,
						fields:["id","type"]
					});
	//    store      ,    json  
	var jsonStore =  new Ext.data.JsonStore({
						url:"../saleInfo.do?method=qryGenreInfo",
						fields:[{name:"id",type:"int"},{name:"type",type:"string"}]
					});
							
	//  form
	var movieForm = new Ext.form.FormPanel({
						url:"../saleInfo.do?method=submitForm",
						title:"    ",
						renderTo:document.body,
						frame:true,
						width:400,
						items:[{
									//textfield title
									xtype:"textfield",
									id:"txtTitle",
									fieldLabel:"  ",
									name:"txtTitle",
									allowBlank:false,
									listeners:{
										specialkey:function(field,e){
											//       ,   
											if(e.getKey() == e.ENTER){
												//  
//												 movieForm.getForm().submit();
												 Ext.MessageBox.alert("test","keydown");
											}
										}
									}
								},{
									//textfield director
									xtype:"textfield",
									fieldLabel:"  ",
									name:"txtDirector",
//									vtype:"alpha"
									vtype:"name"
								},{
									//textfield released
									xtype:"datefield",
									fieldLabel:"    ",
									name:"dtReleased",
									disabledDays:[1,2,3,4,5]
								},{
									//radio
									xtype:"radio",
									fieldLabel:"    ",
									boxLabel:"  ",
									name:"rdFilmColor",
									checked:true
								},{
									xtype:"radio",
									hideLabel:false,//default false 
									labelSeparator:"",//     :
									boxLabel:"  ",
									name:"rdFilmColor"
								},{
									//checkbox
									xtype:"checkbox",
									fieldLabel:"    ",
									name:"chkIsGood"
								},{
									//combobox
									xtype:"combo",
									fieldLabel:"  ",
									name:"cbGenre",
									displayField:"type",//       
//									mode:"local",//      ,    ,       
//									store:localStore,//    
									store:jsonStore,
									triggerAction:"all",//      ,        
									autoLoad:true,
									listeners:{
										select:function(cb,e,index){
											if(index == 0){
												Ext.MessageBox.alert("test","select");
											}
										}
									}
								},{
									//textArea || HTMLEditor
//									xtype:"textarea",
									xtype:"htmleditor",
									name:"txtDescription",
									hideLabel:true,
									labelSeparator:"",
//									height:"100%",
									anchor:"100%"
								}
							],
						buttons:[{
									text:"  ",
									handler:function(){
										movieForm.getForm().submit({
											success:function(f,a){
														console.debug(a.failureType);
														console.debug(a.response);
														//
														Ext.MessageBox.alert("Success!","Yes");
													},
											failure:function(f,a){
														console.debug(a.failureType);
														if(a.failureType == Ext.form.Action.SERVER_INVALID){
															Ext.MessageBox.alert("Warning!",a.result.errors);
														}else if(a.failureType == Ext.form.Action.CONNECT_FAILURE){
															Ext.MessageBox.alert("Warning!",a.response.statusText);
														}else{
															Ext.MessageBox.alert("Warning!","    !");
														} 
														//
													}
										});
									}
								},{
									text:"  ",
									handler:function(){
											movieForm.getForm().reset();
									}
								}
							]
					});
//	//      load,       
//	jsonStore.load();
					
	//      
//	movieForm.getForm().findField("txtDirector").setValue("Jimjackson");
	
	//    
	movieForm.getForm().load({
		url:"../saleInfo.do?method=getFormInfo",
		params:{id:"1"}
	});