`
weiythi
  • 浏览: 7064 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

Ext JS使用表单提交数据

阅读更多
var forms=new Ext.form.FormPanel({
            			 	layout:"form",
            			 	frame:true,
            			 	items:[
            			 		{
	            			 		layout:"column",
	            			 		items:[
	            			 			{
	            			 				columnWidth:.4,
	            			 				xtype:"fieldset",
	            			 				title:"a",
	            			 				layout: 'form',
                                            autoHeight: true,
                                            labelWidth:40,
                                            defaults: {
		            							allowBlank:true,
		            							xtype:'textfield',
		            							width:100
		        							},
	            			 				//defaults:{xtype:textfield},
	            			 				items:[
	            			 					{fieldLabel :"姓名",allowBlank:false,name:"username"},
	            			 					{fieldLabel :"密码",inputType:"password",name:"password"}
	            			 				]
	            			 			},{
	            			 				columnWidth:.6,
	            			 				xtype:"fieldset",
	            			 				title:"b",
	            			 				layout: 'form',
                                            labelWidth: 40,
                                            autoHeight: true,
	            			 				//defaults:{xtype:textfield},
	            			 				items:[
	            			 					{fieldLabel :"性别",allowBlank:false,xtype:"textfield",name:"sex"},
	            			 					{fieldLabel :"年龄",xtype:"textfield",name:"age"}
	            			 				]
	            			 			}
	            			 		]
	            			 	},{
	            			 		xtype:"fieldset",
	            			 		autoHeight: true,
	            			 		title:"aaaaaaa",
	            			 		defaults:{
	            			 			allowBlank:true,
		            					xtype:'textarea',
		            					width:100,
		            					labelWidth:50
	            			 		},
	            			 		items:[
	            			 			{fieldLabel:"个人爱好",width:200,name:"xingqu"}
	            			 		]
	            			 	
	            			 	}
            				]
            				
            			 });
            			 
            			 var windows=new Ext.Window({
            			 	title:"添加窗口",
            			 	height:300,
            			 	width:400,
            			 	layout:"fit",
            			 	items:[forms],
            			 	buttonAlign:'center',
            			 	buttons:[
            			 		{
            			 			text:"ok",
            			 			handler:function(){
            			 				 forms.getForm().submit({
            			 				 	 url : 'demo/demos!ext_test.action',
            			 				 	 waitMsg : '正在提交,请稍等……',
            			 				 	 timeout : 100000,
            			 				 	 method : 'GET',
            			 				 	 reset : true ,   //当提交后清空输入域的值
            			 				 	 success : function(form,action){     //是与业务相关的只有后台响应为true或响应的JSON包含success:true
            			 				 	 	Ext.Msg.alert("Success", action.result.msg);
            			 				 	 },failure : function(form,action){  //后台响应的JSON包含error:{},就认为连接失败
                                 				Ext.Msg.alert('提示','系统登入失败,原因<br/>' + action.failureType); 
                                	 		 }
            			 				 });
            			 			}
            			 		},{
            			 			text:"cancle",
            			 			handler:function(){
            			 				forms.form.reset();
            			 			}
            			 		}
            			 	]
            			 });
            			 windows.show();
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    ext_表单提交_数据校验

    Ext JS提供了多种向后台提交数据的方式,包括传统的HTML表单提交以及基于Ajax的异步提交。其中,`form.submit()`是Ext默认的提交方式,它利用Ajax技术进行数据传输,无需刷新整个页面即可完成数据的提交和响应处理,...

    ext 表单提交

    通常,Ext JS的表单提交使用Ajax方式,这意味着它可以异步地将表单数据发送到服务器,无需页面刷新。这种方式提供了更好的用户体验,因为用户可以在数据提交的同时继续与应用交互。 在Ext JS中,表单(`Ext.form....

    Ext 动态加载表单数据

    在Ext JS这个强大的JavaScript框架中,动态加载表单数据是一种常见的功能需求,特别是在构建数据驱动的应用程序时。本文将深入探讨如何使用JSON格式的数据来实现这一功能,以便于灵活地更新和显示表单内容。 首先,...

    EXT异步提交FORM表单

    - **解析请求参数**:由于EXT默认是以POST方式提交数据,所以在Action中需要确保能够正确解析这些参数。 ```java @Override public void validate() { if (username == null || username.trim().equals("")) { ...

    EXT dojochina ExtAjax表单提交 L9.rar

    "ExtAjax表单提交"是EXTJS中的一个重要功能,用于处理用户在网页上的表单数据,并通过Ajax方式向服务器发送请求,实现异步数据交互。 在EXTJS中,表单(Ext.form.Panel)是数据输入和展示的主要组件。它包含了各种...

    ext表单

    FormPanel是EXT JS中用于创建表单的容器,它提供了对表单操作的基本支持,如加载和提交数据。在FormPanel中,我们可以添加FieldSet来分组相关的表单元素,或者使用ColumnLayout或FitLayout等布局管理器来调整表单...

    ExtJs4.0 表单提交Demo

    在“ExtJs4.0 表单提交Demo”中,我们将深入探讨如何在ExtJs 4.0环境下,通过Ext Ajax模块实现表单的数据提交,同时实现显示层和控制层的分离,提升代码的可维护性和可扩展性。 1. **ExtJs 4.0 表单基础** ExtJs ...

    Ext JS - JavaScript Library

    6. **表单组件**:Ext JS 提供了丰富的表单组件,如文本框、下拉列表、复选框、单选按钮等,以及表单验证和数据提交功能,便于创建用户输入界面。 7. **Ajax和JsonP**:库内内置了Ajax和JsonP支持,方便开发者实现...

    SZ_USER.zip_ext js 表单

    描述中提到的“ext js各种控件的描述 如树控件,文本框 grid表单 分页等等”,这暗示了这个压缩包可能包含了关于以下几种Ext JS控件的实现和使用方法: 1. **树控件(Tree)**:在Ext JS中,树控件用于显示层次结构...

    JavaScript凌厉开发——Ext JS3详解与实践

    6. **表单处理**:Ext JS3的表单组件功能强大,支持各种表单元素,包括文本、复选框、下拉框等,同时提供了验证和提交数据的机制,是构建用户输入界面的关键。 7. **图表和图表组件**:Ext JS3包含一套图表组件,可...

    EXT4.3实现动态表单全动态

    使用`Ext.form.Basic`和`Ext.form.Panel`,可以轻松实现数据的提交和验证。 2. **EXT4.3动态grid**: - **动态列**:EXT4.3的`Ext.grid.Panel`允许在运行时动态添加、删除和调整列宽。开发者可以通过`columns`配置...

    ext js 中文手册

    表单组件是用户与Web应用交互的重要接口,Ext JS提供了丰富的表单组件和字段类型,使得构建复杂的表单验证和数据提交变得简单快捷。 在Ext JS的学习路径上,初学者通常会从下载、安装框架开始,然后通过学习Ext的...

    EXT提交表单,ASP.NET

    1. **创建接收端点**:创建一个ASP.NET页面或Web API控制器方法,这个方法会接收EXTJS表单提交的数据。数据通常以POST方式发送,ASP.NET可以通过`Request.Form`或`Request.InputStream`来获取。 2. **处理数据**:...

    Ext+JSP实现数据提交

    3. **Ajax请求**:使用`Ext.Ajax.request`方法发起异步请求,该方法支持POST或GET方式提交数据。在`action.js`中,可以配置请求的URL(如`action.html`),数据类型,以及成功或失败的回调函数。 4. **服务器端处理...

    EXT提交服务器的三种方式

    在EXT中,有三种主要的方式提交数据到服务器,这些方法主要涉及到前端与后端之间的交互,用于处理用户输入的数据并将其发送到服务器进行处理。以下是EXT提交服务器的三种方式的详细说明: 1. **EXT的Form表单AJAX...

    ext form 表单提交数据的方法小结

    本文主要总结了EXT表单提交数据的三种常见方法:EXT的form表单AJAX提交、非AJAX提交以及EXT的Ajax类直接提交。 1. EXT的form表单AJAX提交(默认提交方式) EXT的form表单默认采用AJAX方式进行数据提交,这样可以在...

    Ext 表单示例演示 视频

    Ext JS是一个强大的JavaScript库,专门用于构建富客户端应用程序,它提供了丰富的组件库,包括各种表单元素、布局和数据绑定机制。XML作为一种常见的数据交换格式,常用于与后台服务器进行数据交互。 首先,`ext.js...

    Ext教程表单表格的使用

    EXT表单FormPanel是EXT JS框架中用于创建复杂表单的组件,它允许用户输入、编辑和验证数据。在上述代码中,`sampleFormPanel`是一个FormPanel实例,包含了多个配置属性,用于定制表单的行为和外观。 1. `frame : ...

    JavaScript凌厉开发(Ext_JS_3详解与实践

    《JavaScript凌厉开发(Ext_JS_3详解与实践)》这本书深入浅出地探讨了JavaScript...这本书的实例丰富、易于理解,对于任何希望提升JavaScript技能,特别是使用Ext JS 3开发Web应用的开发者来说,都是宝贵的参考资料。

    EXT_JS实例,官方实例

    7. **Ajax通信**:EXT JS通过Ajax技术实现异步数据交换,可以轻松地与服务器进行交互,获取或提交数据,无需页面刷新。 8. **Drag & Drop**:EXT JS支持拖放功能,允许用户在界面上自由移动组件,实现更直观的操作...

Global site tag (gtag.js) - Google Analytics