文档章节

ExtJs from和Ajax提交

Element0506
 Element0506
发布于 2015/02/04 09:55
字数 384
阅读 508
收藏 1
// 方式1:加载编辑数据
	loadData : function(id) {
		var className = portal.menu.EditPanel;
		// 清空原有的信息
		className.fromPanel.getForm().reset();
		// 查询加载数据
		className.fromPanel.getForm().load({
			url : 'menu/findById',
			method : 'POST',
			params : {
				id : id // 提交的数据参数
			},
			waitTile : '提示',
			waitMsg : '正在向服务器提交数据',
			success : function(form, action) {
				// action.result.msg
			}
		});
	},
  1. params:  传递参数到后台服务器

  2. success: 成功后调用的方法,这里可以使用action.result.name,快速获取内容,而不用去解析json。

  3. 此方法对于查询详细信息的时候,非常简单。

// 方式2:创建Form手动回填数据,暂不使用,(个人感觉比较麻烦) Ajax方式

initFormData : function(id) {
		var className = portal.menu.EditPanel;
		Ext.Ajax.request({
			url : 'menu/findById',
			params : {
				id : id
			},
			success : function(response) {
				// 解析服务器端返回的json字符串
				var jsonObj = Ext.util.JSON.decode(response.responseText);
				className.menuName.setValue(jsonObj.menu.menuName);
				className.parentId.setValue(jsonObj.menu.parentId);
				className.combo.setValue(jsonObj.menu.r_Type);
			},
			failure : function(options, response) {
				Ext.Msg.alert("错误", "查询失败!");
			}
		});
	},
  1. Ext.Ajax.request() 这里使用的是ajax提交方式,

  2. params:封装的参数和form.load()方法一样。

  3. success: 需要通过

  4. var jsonObj = Ext.util.JSON.decode(response.responseText);

    方式解析服务器返回的json数据。

  5. failure:查询失败的方法。

// 方式3:form提交数据

// form提交数据
			className.fromPanel.getForm().submit(
					{
						url : 'menu/saveMenu',
						method : 'POST',
						waitTitle : "提示",
						waitMsg : '正在提交数据...',
						success : function(form, action) {
							// 服务器端返回的是字符串需要封装为jsonObject
							// var result =
							// Ext.util.JSON.decode(action.response.responseText);
					                    alert("保存成功!");
							// 关闭新增页面
							className.editPanel.close();
							// 重新加载列表数据
							qryClass.loadData();
							// 刷新树,获取根节点reload
							// treeClass.wPanel.getRootNode().reload();
							// 刷新菜单树
							treeClass.wPanel.getSelectionModel()
									.getSelectedNode().reload();
							
						},
						failure : function(form, action) {
							// alert("保存失败");
						}
					});

1.form提交后,服务器返回的消息也需要json解析。

© 著作权归作者所有

Element0506

Element0506

粉丝 12
博文 68
码字总数 18727
作品 0
南京
高级程序员
私信 提问
Ext JS 6.0.0 正式版本发布,跨浏览器的 RIA 框架

Ext JS 6.0.0 正式版本发布,此版本包括大量的新特性以及错误修复: 新特性: Accessibility (3) EXTJS-12098 Containers should track their children’s focus EXTJS-13606 Floating mixi...

chpinck
2015/07/06
8.6K
49
ExtJS 4.2 发布

ExtJS 4.2 下载地址:http://www.sencha.com/products/extjs/download/ext-js-4.2.0/2142 ExtJS 主要用来开发RIA富客户端的AJAX应用,主要用于创建前端用户界面,与后台技术无关的前端ajax框...

oschina
2013/03/15
10.6K
31
ExtJS4.2学习 php版(六)

ExtJS Ext.data.proxy.Memory //定义模型Ext.define('User', { extend: 'Ext.data.Model', fields: [ {name: 'id', type: 'int'}, {name: 'name', type: 'string'}, {name: 'phone', type: '......

lbc19920615
2014/04/03
0
0
ExtJS 4.0 最终版发布

ExtJS 4.0 正式版终于来了。ExtJS 4.0 不仅在框架本身做了很多改进,也带来了很多新的特性,用来开发下一代的可靠的Web应用。 下载 Ext JS 4.0 查看 Release Notes 查看 Examples ExtJS 主要...

红薯
2011/04/26
25.6K
24
Sencha ExtJS 5.1.4 发布,跨浏览器的 RIA 框架

Sencha ExtJS 5.1.4 发布,此版本主要是bug修复。 更新内容: Accessibility (1) EXTJS-20016 - ARIA 包可以通过键盘导航调用组合框上的异常 Bind (1) EXTJS-21266 - 具有否定的双向绑定应标...

genn
2017/02/23
1K
15

没有更多内容

加载失败,请刷新页面

加载更多

二、Docker

1、Docker - The TLDR(Too Long,Don't Read,Linxu 终端工具 ) Docker是在Linux和Windows上运行的软件。它创建、管理和编排容器。该软件以开源方式开发,在Github上作为Moby开源项目的一部分。...

倪伟伟
21分钟前
2
0
Python猫荐书系列之七:Python入门书籍有哪些?

本文原创并首发于公众号【Python猫】,未经授权,请勿转载。 原文地址:https://mp.weixin.qq.com/s/ArN-6mLPzPT8Zoq0Na_tsg 最近,猫哥的 Python 技术学习群里进来了几位比较特殊的同学:一...

豌豆花下猫
今天
5
0
Guava RateLimiter限流源码解析和实例应用

在开发高并发系统时有三把利器用来保护系统:缓存、降级和限流 缓存 缓存的目的是提升系统访问速度和增大系统处理容量 降级 降级是当服务出现问题或者影响到核心流程时,需要暂时屏蔽掉,待高...

算法之名
今天
13
0
国产达梦数据库与MySQL的区别

背景 由于项目上的需要,把项目实现国产化,把底层的MySQL数据库替换为国产的达梦数据库,花了一周的时间研究了国产的数据库-达梦数据库,它和MySQL有一定的区别,SQL的写法也有一些区别。 ...

TSMYK
今天
2
0
老也有错?35岁程序员是一道坎,横亘在每个技术职场人的心中

随着互联网的高速发展变革,大龄恐惧症越来越多地在技术圈被人讨论。很多程序员在工作5-10年以后,都会开始思考5年、10年甚至更久以后的自己,会是怎样一种生活工作状态,以及是否会被时代抛...

我最喜欢三大框架
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部