EXT ajax简单实例
转载:http://www.cnblogs.com/xiepeixing/archive/2012/10/24/2736751.html
EXT ajax request是ext中对于ajax请求的实现。
通过客户端向服务端发送Ajax请求,可以“直接”调用MVC的action方法,并传递参数,action返回值可以是普通字符串,也可以是json对象。请求可以添加自定义头信息
例1异步请求,发送请求头。
Ext.onReady(function () {new Ext.Button({renderTo: "div1",text: "后台Ajax提交",handler: function () {Ext.Ajax.request({url: 'Ajax_Func1',headers: {'userHeader': 'userMsg'},params: { a: 10, b: 20 },method: 'GET',success: function (response, options) {Ext.MessageBox.alert('成功', '从服务端获取结果: ' + response.responseText);},failure: function (response, options) {Ext.MessageBox.alert('失败', '请求超时或网络故障,错误编号:' + response.status);}});},id: "bt1"});});
后台的代码:
public ContentResult Ajax_Func1(int a, int b) {string userHeaderMsg = Convert.ToString(Request.Headers["userHeader"]);return Content((a + b).ToString() + ",userHeader:" + userHeaderMsg); }
例2 异步请求,返回json结果
Ext.onReady(function () {new Ext.Button({renderTo: "div1",text: "后台Ajax提交方式2返回JSON",handler: function () {Ext.Ajax.request({url: 'Ajax_Func2',params: { n: 10 },method: 'POST',callback: function (options, success, response) {if (success) {var responseJson = Ext.JSON.decode(response.responseText);Ext.Msg.alert("成功", options.params.n + "的阶乘是:<font color='red'>" + responseJson.n1 + "</font><br />"+ options.params.n + "的累加是:<font color='red'>" + responseJson.n2 + "</font>");} else {Ext.Msg.confirm('失败','请求超时或网络故障,错误编号:[' + response.status + ']是否要重新发送?', function (btn) {if (btn == 'yes') {Ext.Ajax.request(options);}});}}});}});});
例3 异步文件上传:
//文件上传 Ext.get("button1").on("click", function () {Ext.Ajax.request({url: "Ajax_FileUp",isUpload: true,form: "form1",success: function (response) {Ext.MessageBox.alert("上传成功,文本文件内容:", response.responseText);}}); });
public ContentResult Ajax_FileUp(HttpPostedFileBase file) {System.IO.StreamReader r = new System.IO.StreamReader(file.InputStream, System.Text.UTF8Encoding.Default);var str = r.ReadToEnd();return Content(str); }
例4 异步请求事件。 当发起ajax请求之前,可以监听beforerequest事件,本例每当发起ajax事件时,都会把计算器+1:
var ajaxCount = 0; //每当Ajax请求发起时触发: Ext.Ajax.on('beforerequest', function () { Ext.get("span1").update(++ajaxCount) }, this);
ajax几个常用的参数如下:
success Function 指定当Ajax请求执行成功后执行的回调函数,传递给回调函数两个参数,第一个参数response表示执行Ajax请求的XMLHttpRequet对象,第二个参数表示执行request方法时的options对象。
failure Function 指定当请求出现错误时执行的回调函数,传递给回调函数两个参数,第一个参数response表示执行Ajax请求的XMLHttpRequet对象,第二个参数表示执行request方法时的options对象。
scope Object 指定回调函数的作用域,默认为浏览器window。
form Object/String 指定要提交的表单id或表单数据对象。
isUpload Boolean 指定要提交的表单是否是文件上传表单,默认情况下会自动检查。
headers Object 指定请求的Header信息。
xmlData Object 指定用于发送给服务器的xml文档,如果指定了该属性则其它地方设置的参数将无效。
jsonData Object/String 指定需要发送给服务器端的JSON数据。如果指定了该属性则其它的地方设置的要发送的参数值将无效。
disableCaching Boolean 是否禁止cache。
总结一下,ext ajax和jquery的ajax差不多,主要是熟悉几个参数,处理好返回值。
EXT ajax简单实例相关推荐
- js中的json ajax,js结合json实现ajax简单实例
这篇文章主要为大家详细介绍了js结合json实现ajax简单实例的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 前期准备 1.安装wampserver或者其他相似软件来搭建本地集成安装环 ...
- ajax简单实例代码,分享Ajax创建简单实例代码
XmlHttp是一套可以在Javascript.VbScript.Jscript等脚本语言中通过http协议传送或从接收XML及其他数据的一套API.XmlHttp最大的用处是可以更新网页的部分内容而 ...
- php ajax简单实例代码,Ajax的简单实用实例代码
这篇文章主要介绍了Ajax的简单实用实例代码,对ajax感兴趣的朋友可以参考下Ajax的简单实用的方法 我将实现一个简单的Ajax页面无刷新进行用户验证案例: 效果如下图: 实现主要过程: 在User ...
- JSON+AJAX 简单实例
最近把系统给彻彻底底的给清理了,在清理的时候居然发现以前的项目,和习题.所以拿出来给大家看看.也做个纪念.晕 内容如下: 我这里是json.js(放在index.jsp中,记得一定要放在所以js的第一 ...
- java ajax简单实例_JAVA编写的AJAX例子,很简单,但是很容易理解详解
非原创,但是从哪来的我也忘了,呵呵! window.onload = function() { CreateDateSelect(); } var xmlHttp = false; var e; // ...
- ajax前台获取json,ajax与json 获取数据并在前台使用简单实例
ajax与json 获取数据并在前台使用简单实例 发布于 2017-05-18 14:05:38 | 63 次阅读 | 评论: 0 | 来源: 网友投递 AjaxAJAX即"Asynchro ...
- (三)AJAX基本介绍和简单实例03
(三)AJAX基本介绍和简单实例03-----Ajax与数据库的动态应用 前台显示界面: 选择所有客户之后: 选择其中一个客户---杜森: Demo03.html代码 <html> < ...
- ajax webservice 参数类型,JQuery Ajax WebService传递参数的简单实例
Asp.NET中利用jQuery实现Ajax时,在服务器端可以使用aspx,ashx,以及WebService等方式.最近研究了一下WebService方式,jQuery Ajax 方法调用 jQue ...
- ajax排行页面,ajax简单页面
简单的注册页面运用ajax 主页面 无标题文档 //首先引用jquery文件 登录页面 用户名: 密码: $("#btn").click(function(){ //1.取内容 v ...
最新文章
- 5、python学习之变量
- Epoll在LT和ET模式下的读写方式
- 八数码 poj 1077 广搜 A* IDA*
- Lua脚本式编程示例
- windows分区的理解
- Apache 重写规则的常见应用 (rewrite)
- 判断一个无符号整数是不是2的幂
- 【2016年第6期】产业生态的4个特征
- python拖拽获取文件路径_求助tkinter模块如何获取拖拽文件的内容
- C#属性默认值设置(model实体类)
- 云计算和虚拟化的关系
- Ubuntu18.04创建WiFi热点
- Java项目架构的演变
- 像素与照片尺寸、分辨率之间的关系
- 当AI对话系统像自动驾驶一样分级,谁能率先跑出L5?
- Could not find parameter map com.itcast.mapper.userinfMapper.map
- 基于Tiny-51操作系统的51单片机温度测控系统设计
- STM32 之 MDA
- 黑马训练营--IOS学习---OC语言学习总结2
- 学生上计算机课的好处,孩子上网课有什么优点