ExtJs from和Ajax提交

前端之家收集整理的这篇文章主要介绍了ExtJs from和Ajax提交前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
//方式1:加载编辑数据
	loadData:function(id){
		varclassName=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){
		varclassName=portal.menu.EditPanel;
		Ext.Ajax.request({
			url:'menu/findById',params:{
				id:id
			},success:function(response){
				//解析服务器端返回的json字符串
				varjsonObj=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. varjsonObj=Ext.util.JSON.decode(response.responseText);

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

  5. failure:查询失败的方法

// 方式3:form提交数据

//form提交数据
			className.fromPanel.getForm().submit(
					{
						url:'menu/saveMenu',waitTitle:"提示",waitMsg:'正在提交数据...',action){
							//服务器端返回的是字符串需要封装为jsonObject
							//varresult=
							//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解析。

原文链接:https://www.f2er.com/ajax/163784.html

猜你在找的Ajax相关文章