EXTJS 之 form

最新推荐文章于 2019-01-10 11:07:16 发布

FrankBian666

最新推荐文章于 2019-01-10 11:07:16 发布

阅读量1k

点赞数

分类专栏：工作之前的随笔文章标签： ext javascript form

本文链接：https://blog.csdn.net/gansuer/article/details/9381005

版权

工作之前的随笔专栏收录该内容

37 篇文章 0 订阅

订阅专栏

你妹哦，本来准备给那个grid里面的新建搞个弹出的form，结果自己搞了半天是没有搞定，fuck，

死活弹不出，就先弄了个form的demo先看下。

form.html:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>CreateNewInfo</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="ext//examples.css" />
<script type="text/javascript" src="ext//ext-base.js"></script>
<script type="text/javascript" src="ext//ext-all.js"></script>
<script type="text/javascript" src="form.js"></script>
</head>
<body>
	<p>注册表单</p>
	<div id="form></div>
</body>
</html>

form.js:

Ext.onReady(function() {  
	Ext.QuickTips.init() ;   //初始化tips，使得tips可用
	
	var cform = new Ext.form.FormPanel({
		title:'新建联系人信息',
		autoheight:true,
		width:400,
		frame:true,
		// applyTo:'form',
		// renderTo:'form',
		// applyTo:Ext.getBody(),
		renderTo:Ext.getBody(),
		labelAlign:'right',
		labelSeparator:':',
		labelWidth:'100',
		items:[
		       new Ext.form.TextField({
		    	   fieldLabel:'编号',
		    	   name:'id',
		    	   allowBlank:false,
		    	   blankText:'联系人编号'
		       }),
		       new Ext.form.TextField({
		    	   fieldLabel:'姓名',
		    	   name:'name',
		    	   allowBlank:false,
		    	  
		       }),
		       new Ext.form.TextField({
		    	   fieldLabel:'电话号码',
		    	   name:'phone',
		    	   allowBlank:false
		    	 
		       }),
		       // new Ext.form.RadioGroup({
		       //     fieldLabel:'性别',
		       //     name:'gender',
		       //     id:'gender',
		       //     items:[
		          
		       // }), 
	 			new Ext.form.Radio({ 
	 				name:'gender',
	 				fieldLabel:'性别',
		    	   itemCls: 'float-left', 
		    	   clearCls: 'allow-float', 
		    	   boxLabel: 'man' 
		    	   }), 
		      	   new Ext.form.Radio({ 
		      	   	name:'gender',
		    	   clearCls: 'stop-float', 
		    	   boxLabel: 'woman', 
		    	   margin:'left'
		    	   }),
		           
		       new Ext.form.TextField({
		    	   fieldLabel:'描述',
		    	   id:'',
		    	   allowBlank:false,
		    	   blankText:'联系人编号'
		       }),
		       ],
		  buttons:[
		           new Ext.Button({
		        	  text:'保存',
		        	  handler:createInfo
		           })],
		
	});
	function createInfo(){
		cform.getForm().submit({
			clientValidtion:true,
			waitMeg:'正在保存……',
			method:'POST',
			utl:'../EXTPractise/ext/CreateInfo',
			success:function(form,action){
			Ext.MessageBox.alert("Tips","保存成功！");
		},failure:function(form,action){
			Ext.MessageBox.alert("Tips","保存失败！");
		}
			
		});
	}
    
    
});

这里的applyTo和renderTo 给的参数用“form”,的话，那个form是怎么也显示不出来，不知道什么情况，看了下API，说的是给个id就行了，但是这个实际不是这样的……

具体原因在研究中：