其实Ext.Ajax的使用并不难,只是当初我一直不清楚如何获取其返回值,搞得郁闷了一阵子,以下是一个比较简单的例子
1Ext.Ajax.request({
2 url: 'Register.aspx',
3 params: {
4 oper: 'login',
5 LoginEmail:Ext.get('LoginEmail').dom.value,
6 LoginPwd:Ext.get('LoginPwd').dom.value
7 },
8 success: function(response, options) {
9 var responseArray = Ext.util.JSON.decode(response.responseText);
10 if(responseArray.success=='true'){
11 Cookies.set('Allcard_userName', responseArray.user);
12 Ext.Msg.alert('信息','您已成功登录!',IsLogin);
13 }
14 else{
15 Ext.Msg.alert('失败','登录失败,请确认您的帐号密码无误!');
16 }
17 }
18 });
代码说明:
2行:URL参数是要提交到的页面
3行:params是一个需要提交的参数集,使用逗号分隔
8行:当回调成功返回后要执行的函数
9行:获取服务器端的回调参数值
10行:对回调值进行判断处理
这里需要说明一下的是如何获取回调参数值,Extjs里是通过JSON的数据格式来获取参数的,因此在服务器端处理完事情后,回调的参数应该这样写:(以下是ASP.NET里的写法)
result = "{success:true,user:'winson'}";
Response.Write(result);
Response.End();
将数据以键值对的形式返回,接收时就可使用第一段代码里第9行的方法来接收,由于使用的是JSON格式,因此服务器端就可以非常方便地同时返回多个参数值了。
Ext.Ajax基本使用就是这样,其实也挺简单的,只是如果要在提交时增加Loading效果,那就比较麻烦了,呵,这里我也没深入研究
接下来还有比较复杂的表单应用!
分享到:
相关推荐
总结,本示例介绍了在Ext2.0.2中如何利用Ajax请求的拦截器进行预处理和后处理。通过`beforeSend`、`success`回调以及全局的`beforerequest`和`requestcomplete`事件,开发者可以在Ajax请求生命周期的各个阶段插入...
"Ext.JS6学习文档.pdf"则可能是更系统化的教程,不仅包含了基本概念和API的介绍,也可能包括高级特性,如拖放功能、图表组件的复杂使用、高级布局、自定义组件开发等。此外,文档可能会深入讲解MVC(Model-View-...
例如,jQuery的$.ajax()方法可以方便地发起Ajax请求,而Ext JS则提供了丰富的UI组件和强大的Ajax功能。 书中还可能会深入到JSON的使用,如何在服务器端生成JSON数据,并在客户端解析和展示。JSON-P(JSON with ...
### Ext.data专题详解 #### 一、Ext.data概述 **Ext.data** 是一个重要的JavaScript库...此外,通过 **Ext.data.Connection** 的封装,使得使用Ajax变得更加简单高效。这对于构建现代化的Web应用程序是非常有用的。
例如,一个简单的ComboBox配置可能如下所示: ```javascript Ext.create('Ext.form.ComboBox', { fieldLabel: 'AutoComplete', store: { fields: ['id', 'name'], proxy: { type: 'ajax', url: 'auto_...
3. **Ajax请求**:使用`Ext.Ajax.request`方法发起异步请求,该方法支持POST或GET方式提交数据。在`action.js`中,可以配置请求的URL(如`action.html`),数据类型,以及成功或失败的回调函数。 4. **服务器端处理...
【EXTJS】Ext.AJAX与FormPanel在登录案例中的应用 EXTJS是一个强大的JavaScript库,主要用于构建富客户端Web应用程序。在EXTJS中,Ext.AJAX和Ext.FormPanel是两个核心组件,它们分别用于异步与服务器进行数据交互和...
在提供的压缩包文件名“MyFirstSample”中,我们可以推测这是入门示例,可能包含了一个简单的.NET应用程序,它定义了几个Ext.Direct服务,并且有对应的Ext JS前端代码来调用这些服务。这个示例可能会教导开发者如何...
通过Connection,开发者可以更简单地配置和执行Ajax请求,包括设置请求头、超时时间、附加参数、请求方法等。 下面是一个使用Ext.data.Connection的例子: ```javascript var conn = new Ext.data.Connection({ ...
例如,一个简单的EXT Ajax GET请求可能如下所示: ```javascript Ext.Ajax.get({ url: 'data.json', // 请求的URL params: {key: 'value'}, // 发送的数据 success: function(response, opts) { var data = Ext....
1.4 ext js的开发工具的获取、安装与配置介绍 / 18 1.4.1 ext designer / 18 1.4.2 在visual studio中实现智能提示 / 23 1.4.3 spket / 28 1.4.4 在eclipse中实现智能提示 / 32 1.5 如何获得帮助 / 32 1.6 本...
Ext.direct是一种在客户端JavaScript与服务器端Java之间进行高效通信的技术,由Sencha公司开发,主要用于构建富客户端应用程序。它提供了一种结构化的API,使得前端的Ext JS框架能够与后端服务进行无缝交互,简化了...
ExtCore的核心功能覆盖了DOM操作、Ajax请求、事件处理、动画效果、模板引擎以及面向对象(OO)机制等,几乎涵盖了Web前端开发的所有关键领域。这使得无论是简单的动态网页还是复杂的Web应用,都能从ExtCore中获益。 #...
在EXTJS中,Ext.AJAX是进行异步数据通信的核心组件,简化了传统XMLHttpRequest对象的使用,使得与服务器端的数据交换变得更加简单。 在两个登录示例中,我们分别看到了基于HTML form表单和Ext.FormPanel的EXTJS登录...
如果数据需要从后台获取,我们可以使用`Ext.data.JsonStore`或`Ext.data.Store`与`Ext.Ajax.request`结合。例如: ```javascript Ext.Ajax.request({ url: 'getData.php', // 后台数据接口 success: function...
使用Ext.Ajax.request方法,可以在Sencha Touch中发起Ajax请求。 Ext.Ajax.request是Sencha Touch提供的一个便捷方式来发起Ajax请求。此方法用于与服务器端的ashx文件进行交互,ashx是一种在.NET环境中处理HTTP请求...
5. **视图层(View)**: 视图负责显示数据,EXT的组件系统使得创建复杂的用户界面变得简单。 6. **控制器(Controller)**: 控制器是MVC模式的一部分,用于处理事件和协调视图与模型之间的交互。 ### 结合使用...
4. **远程数据加载(远程Proxy)**:当数据源位于服务器端时,例如通过Ajax请求获取JSON数据,可以使用`Ext.data.proxy.Ajax`。在请求成功后,Store会调用Json Reader解析响应的JSON数据,并将数据加载到Store中。 ...
- **概述**:Ext.Ajax类提供了一个简单的AJAX请求接口。 - **常用方法**: - `Ext.Ajax.request(config)`:发送AJAX请求。 - `Ext.Ajax.abort()`:取消正在发送的AJAX请求。 #### 二十六、Ext.data.Record类(第...
22. **Ext.data.Connection类**和**Ajax类**:提供了与服务器的数据交换功能,支持异步请求。 23. **Ext.data.Record类**:数据记录模型,用于存储和操作数据。 24. **Ext.data.DataProxy类**:数据代理,抽象了...