`
liuxi1024
  • 浏览: 390920 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Extjs数据提交方式--单独Ajax提交

 
阅读更多

1、一般分为“form的submit提交”、“单独Ajax提交”

 

formname.form.submit({
    url : '',
    method : 'POST',
    waitMsg:'正在保存数据,请等待...',                
	success : function(form, action) {
    },
    failure : function(form, action) {
    }
});

Ext.Ajax.request({
    url : '',
    method : 'POST',
    success : function(result, request) {
    },
    failure : function(form, action) {
    }
});

 

2、相关问题及解决方法

(1)问题点: 单独Ajax提交方式,只要能够提交到后台不管数据能否正确执行就回调success函数,如果网络有故障,或者页面有错误数据到不了后台,就执行failure函数。而我们一般要求是:数据处理成功后显示成功信息,失败后显示失败信息。

 

如:后台返回结果:

{success:true}
{success:false,errors:connect}

 

 

(2)解决:在js页面中的success函数中取得返回值,我们对返回值进行判断,如果success是true我门就打印成功信息,如果success是false我们就打印失败的提示。

 

(3)从后台取得返回值:var responseArray = Ext.util.JSON.decode(response.responseText);

 

说明:Ext.util.JSON.decode()功能是将json字符串转成对象。相反的还有encode是将对象转成json字符串。

 

(4)代码示例

handler: function() {
Ext.Msg.wait('处理中,请稍后...', '提示'); //进度条等待
Ext.Ajax.request({
	async : false,//同步
	url: 'upload/test.do',
	success:function(response, options){
		//隐藏进度条
		Ext.Msg.hide();
		//将json数据字符串转变为对象
		var responseArray = Ext.util.JSON.decode(response.responseText);
		//成功
		if(responseArray.success==true){
			Ext.example.msg('成功', '           上传成功                    ');
		}else{
			//失败的几种返回情况
			if(responseArray.errors == 'connect')
				Ext.MessageBox.show({title: '失败',msg: '连接中心服务器失败,请检查网络配置!',buttons: Ext.MessageBox.OK,icon: Ext.MessageBox.ERROR});
			else if(responseArray.errors == 'server')
				Ext.MessageBox.show({title: '失败',msg: '服务器错误,上传失败!',buttons: Ext.MessageBox.OK,icon: Ext.MessageBox.ERROR});
			else
				Ext.MessageBox.show({title: '失败',msg: '上传失败',buttons: Ext.MessageBox.OK,icon: Ext.MessageBox.ERROR});
		}
	},
	failure:function(response,options){
		Ext.Msg.hide();
		Ext.MessageBox.show({title: '失败',msg: '上传失败',buttons: Ext.MessageBox.OK,icon: Ext.MessageBox.ERROR});
	}
});
}

 

 

 

分享到:
评论

相关推荐

    ExtJS-3.4.0系列目录

    **ExtJS-3.4.0系列目录** 在ExtJS框架中,3.4.0版本提供了丰富的组件和功能,...在实际开发中,开发者还可以结合Ajax、Store、Proxy等概念来处理异步数据,以及利用ExtJS的事件系统进行组件间的通信和响应用户的操作。

    extjs-grid-row-editing-php-backend

    Row Editing插件为Grid提供了一种用户友好的编辑模式,允许用户直接在表格行内编辑单元格数据,而不是打开单独的编辑窗口。这个项目中的源代码演示了如何集成并使用Row Editing插件。 首先,我们要了解Row Editing...

    AnyFo_-_ExtJS_移魂大法

    ExtJS提供了多种数据展示方式,如模板显示和DataView等。 ##### 9.1 模板显示 - XTemplate - **效果**:使用XTemplate动态渲染数据。 - **JS文件**: ```javascript var tpl = new Ext.XTemplate( '<ul>', '...

    Extjs 3.0 中文API CHM

    8. **Ajax和JsonP**:ExtJS内置了Ajax和JsonP支持,使得与服务器端的数据交换变得简单。通过使用这些功能,开发者可以创建异步、无刷新的应用程序。 9. **工具栏和菜单(Toolbars & Menus)**:这些组件为应用程序...

    extjs 多文件上传

    在ExtJS中,我们可以在表单提交之前,使用`Ext.Element`的`dom`属性获取到原始DOM元素,然后通过`new FormData(formElement.dom)`创建一个`FormData`实例。 三、Ajax 或 XMLHttpRequest 为了在不刷新页面的情况下...

    Extjs4+MVC+struts2后台管理系统

    在这个系统中,Struts2作为服务器端的核心,接收前端ExtJS4发送的AJAX请求,进行数据处理并返回响应。 登录和验证码功能是任何管理系统的重要组成部分。在"Extjs4+MVC+struts2后台管理系统"中,登录界面可能由ExtJS...

    ExtJS3.3.0整合SSH

    在 ExtJS 应用中,可以创建一个 FormPanel,包含用户名和密码字段,然后使用 AJAX 请求提交表单数据到 Struts2 动作,最后由 Struts2 返回结果到 ExtJS 控件。 总之,ExtJS 3.3.0 与 SSH 的整合允许开发者构建高效...

    extJs 2.1学习笔记

    12. **通信篇**:这一部分深入探讨了ExtJs中的Ajax通信技术,包括异步请求、数据传输格式、请求头的设置等。 13. **extJs 2.0学习笔记**:这部分内容可能包含与2.1版本相关的进阶主题,如Ajax的使用、Ext.data的...

    Extjs图片上传 带过滤和缩略图

    你可以利用ExtJS的`Ajax`类或`form.submit`方法来实现异步提交。 9. **批量上传**: 如果需要支持批量上传,可以考虑使用多选文件控件,并对每个文件进行单独的上传操作,或者将多个文件打包成一个大文件进行上传...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    --我们做了优化,现在要使一个Asp.net的按钮能够AJAX提交,你不需要做任何设置(PageManager的属性EnableAjax为true即可,这是默认属性)。 +PageManager的实例方法AddAjaxUpdateControl改名为...

    ExtAspNet_v2.3.2_dll

    -使得Asp.net的控件ImageButton具有和Asp.net的Button控件类似的行为(Ajax提交)(feedback:261629698)。 +TabStrip增加GetAddTabReference和GetRemoveTabReference两个函数,用来向TabStrip控件动态增加删除Tab。...

    Extjs优化(一)删除冗余代码提高运行速度

    它显示确认对话框,并在用户确认后发送Ajax请求删除数据。原代码包含了一些可以简化的地方,比如使用箭头函数和对象解构,这样可以减少代码行数,同时保持清晰可读: ```javascript function $postDel({ url, ...

    EexJS实现多文件上传与下载

    在EXTJS中实现多文件上传和下载...总之,EXTJS实现多文件上传和下载涉及前端的文件选择、数据提交、状态显示,以及后端的接收、验证和返回响应。理解并掌握这些知识点,能帮助开发者构建出高效、稳定的文件操作功能。

    Ext js 批量上传

    批量上传时,我们可能需要对每个文件进行单独的提交,或者将所有文件打包成一个大的多部分表单数据包发送。 配置文件在批量上传中也扮演着重要角色。这些文件可能包括 Ext JS 应用的配置(如`app.json`),以及...

    GoodProject Maven Webapp.zip

    通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。 传统的网页(不使用 AJAX)如果需要更新内容,必须重载整个网页页面。 系统...

    frameset 上传文件窗口最小化(未实现)

    然后,通过AJAX或者表单提交的方式,将选定的文件发送到服务器进行处理。 2. **frameset和iframe**:两者都是用来在网页中嵌入其他页面的元素。frameset是HTML4时代的特性,用于划分页面为多个框架;iframe则是...

    EXT2.0中文教程

    碰到使用ajax获得数据,或者提交数据出现乱码 A.8. TabPanel使用autoLoad加载的页面中的js脚本没有执行 B. 修改日志 C. 后记 C.1. 2007年12月5日,迷茫阶段 C.1.1. 仇恨 C.1.2. 反省 C.2. 关于ext与dwr整合部分的...

    Ext 开发指南 学习资料

    碰到使用ajax获得数据,或者提交数据出现乱码 A.8. TabPanel使用autoLoad加载的页面中的js脚本没有执行 A.9. 有关grid的一些小问题 A.9.1. 如何让grid总所有的列都支持排序 A.9.2. 修改一个grid的ColumnModel和...

Global site tag (gtag.js) - Google Analytics