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

extjs ajax方式前后台数据传送(json格式)

 
阅读更多

本人也是学习extjs中摸索,有不对的地方,请指正.

extjs用ajax传送数据的方法有post(用普通的表单或用json格式),get(用params).

在回传的时候用json(推荐方法) ,需要注意的是服务器必须要返回json格式,并且必须要设置success的值,当然你不这样也能,但是这种方式应该是官方提倡的方式.

这里主要总结json数据服务器回传的方法.

在api总指出回传的格式{success;true,data:{clientName: "Fred. Olsen Lines", portOfLoading:"FXT",portOfDischarge: "OSL" } }}}

需要注意的是这里的success和data是关键字,(姑且这么叫吧)在data中是数据在客户端通过

Ext.decode(response.responseText).clientName获得.第一个回传数据.这里证明在用

success: function(response){}函数的时候,参数response是一个json字符串,通过Ext.decode解析了data的数据集.

//成功时回叫,第一个参数为XMLHttpRequest对象,第二个参数传入指定的options

所有,这里前后台的代码应该这样统一:

后台(asp):

response.write "{success:false,data:{msg:'密码或用户名不能为空!'}}"

response.write "{success:true,data:{msg:'登陆成功!'}}"

前台:

success: function(response,options){Ext.MessageBox.alert(' 提示',Ext.decode(response.responseText).msg);},
failure: function(response,options){Ext.MessageBox.alert('提示','Ext.decode(response.responseText).msg);},

还可以:

Ext.util.JSON.decode(response.responseText);这个也是对json编码的解析.

另外在网上还看到这样代码:

服务器:

{ success:false, errors:{errstr: '用户名或者密码错误'} }

客户端:

success : function(form, action) {//response,options
location.href = jmp.asp;//登陆成功后暂时用js做了跳转
},
failure : function(form, action) {//response,options
Ext.Msg.alert('登陆失败', action.result.errors.errstr);
},

并没有使用知道的data关键字,其实这样也可以.但是注意success这个关键字必须要使用.!!!!

这里不是很清楚,我猜测,前面的例子是用第一个参数获取,这里是用第二个参数获取.

给出Ext.Ajax.request方法

使用Ext.Ajax.request方法来进行的,该方法可以用来向服务器端发送一个http请求,并可以在回调函数中处理返回的结果。往远程服务器发送一个HTTP请求,发送Ajax调用的时候该方法的签名如下:
Ext.Ajax.rquest( [Object options] ) : Number

  服务器的响应是异步的,因此需要在回调函数中处理服务器端返回的数据。回调函数可以定义在request方法调用的参数options中。另外,在request方法中可以定义Ajax请求的一些其它属性。参数options是一个对象,该对象包含了Ajax请求所需的各种参数及回调处理参数等。options中可以包含的各个属性及含义如下所示:
  urlString指定要请求的服务器端url,默认值为Ajax对象中配置的URL参数值。
  paramsObject/String/Function指定要传递的参数,可以是一个包含参数名称及值的对象,也可以是name=xx&birthday=1978-1-1类似的url编码字符串,或者是一个能返回上述两种内容的函数。
  methodString指定发送Ajax请求使用的method,可以是GET或POST方式。默认情况下,如果请求中没有传递任何参数则使用GET,否则使用POST。
  callbackFunction指定Ajax请求的回调函数,该函数不管是调用成功或失败,都会执行。传递给回调函数的参数有三个,第一个options表示执行request方法时的参数,第二个success表示请求是否成功,第三个参数response表示用来执行Ajax请求的XMLHttpRequest 对象。关于XMLHttpRequest可以通过http://www.w3.org/TR/XMLHttpRequest/查询详细的信息。
  successFunction指定当Ajax请求执行成功后执行的回调函数,传递给回调函数两个参数,第一个参数response表示执行Ajax请求的XMLHttpRequet对象,第二个参数表示执行request方法时的options对象。
  failureFunction指定当请求出现错误时执行的回调函数,传递给回调函数两个参数,第一个参数response表示执行Ajax请求的XMLHttpRequet对象,第二个参数表示执行request方法时的options对象。
  scopeObject指定回调函数的作用域,默认为浏览器window。
  formObject/String指定要提交的表单id或表单数据对象。
  isUploadBoolean指定要提交的表单是否是文件上传表单,默认情况下会自动检查。
  headersObject指定请求的Header信息。
  xmlDataObject指定用于发送给服务器的xml文档,如果指定了该属性则其它地方设置的参数将无效。
  jsonDataObject/String指定需要发送给服务器端的JSON数据。如果指定了该属性则其它的地方设置的要发送的参数值将无效。
  disableCachingBoolean是否禁止cache。

版权声明:本文为博主原创文章,未经博主允许不得转载。

分享到:
评论

相关推荐

    EXTJS AJAX方式发送数据给后台服务器.rar

    总结,EXTJS AJAX方式发送数据给后台服务器是Web开发中常见的操作,通过理解和掌握EXTJS的AJAX方法,可以提升Web应用的交互性和效率。在实际项目中,应根据需求灵活运用,并注意处理可能出现的各种异常情况,以保证...

    介绍如何应用ExtJs进行前后台的数据交互

    在前后台数据交互中,ExtJs 起着至关重要的作用,它可以与服务器端进行异步通信,实现数据的获取、更新、删除等操作。本文将详细介绍如何使用ExtJs 进行前后台数据交互,并修复可能出现的问题。 首先,理解ExtJs的...

    extjs 中间页 后台json

    在标题和描述中提到的“中间页”和“后台JSON”,通常指的是在ExtJS应用中,通过一个中间页面来处理与服务器的数据交互,这个中间页面通常会从后端服务接收或发送JSON格式的数据。 **中间页(Middleware)** 在Web...

    extjs和数据库的后台交互

    2. **JSON数据格式**:在前后台交互中,JSON(JavaScript Object Notation)是一种常见的数据交换格式。ExtJS的组件和模型(Models)支持JSON数据,因此在与后台交互时,通常会将数据库中的数据转换为JSON格式发送给...

    JSP中获取ExtJS.Ajax前台传递的JSON数据实现过程

    开发者可以通过ExtJS的组件如`Ext.Ajax.request`方法,构造一个Ajax请求,将数据以JSON格式发送到服务器端。这是前台部分的实现,不涉及本主题的知识点。 2. 服务器端接收数据: 在JSP页面中,首先需要确保可以...

    Extjs_前后台数据交互[归类].pdf

    《ExtJS 前后台数据交互详解》 在软件开发中,前端与后端的数据交互是必不可少的一个环节,尤其在Web应用中,这种交互尤为重要。本文将深入探讨ExtJS框架如何与后台进行数据交换,主要关注ExtJS的Ajax请求以及后台...

    Extjs 与后台交互的实例

    1. **ExtJS的数据交互**:ExtJS通过Ajax方式与服务器进行数据通信。它使用Store组件来管理数据,并通过Proxy组件定义与服务器的通信协议。通常,我们可以配置Proxy为`Ajax`类型,设置URL指向后台Servlet,然后通过`...

    extjs动态表格实例(封装GRID,从STRUTS2读取后台数据 )

    2. **配置Store**:设置Store的数据源为远程数据,通常使用Ajax proxy,指定URL为Struts2的Action,以及数据的JSON格式。 3. **Struts2 Action配置**:在后台,创建一个Struts2 Action,处理来自前端的请求,执行...

    ext 前后台数据交互

    下面我们将详细介绍Ext前后台数据交互的原理和实现方式。 一、Ext.data.Connection组件 Ext.data.Connection组件是Ext提供的一种异步调用后台服务的方式,它可以将前台的请求发送到后台,并将后台的响应返回到前台...

    EXTJS 服装批发网站后台

    - **data**:可能存储了示例数据或者JSON格式的产品和订单数据。 - **Default.htm**:另一个可能的首页,用于启动EXTJS应用。 4. **技术栈与实现**: 除了EXTJS,此项目可能还使用了ASP.NET作为后端技术,处理...

    基于ExtJS的通用后台管理系统

    Java以其稳定性和可扩展性,常用于构建企业级的后台服务,处理数据请求,执行业务逻辑,并返回JSON格式的数据给ExtJS前端。 描述中提到"淘宝买的",这可能意味着这个系统是基于某个开源模板或者框架修改而来的,...

    Extjs和后台数据库交互的程序,增删改查

    ExtJS与后台通信通常采用JSON格式,它是轻量级的数据交换格式,易于人阅读和编写,也易于机器解析和生成。数据在前后端之间以JSON格式传输,提高了数据处理效率。 10. **部署与运行** 提供的项目文件“extJs”...

    ASPnet+Extjs+网站通用后台框架

    6. 模型(Models):在前后端之间传递数据的对象,通常使用JSON格式进行序列化和反序列化。 7. 状态管理:使用ASP.NET的状态管理机制(如Session、Cache等)来保存用户状态和应用上下文信息。 8. 错误处理和日志...

    extjs4.2+ibatis+struts构建的ajax日程表插件

    开发者可以定义特定的Struts Action,处理日程的增删改查操作,然后返回JSON或XML格式的数据响应EXTJS前端。 iBATIS是SQL映射框架,它允许开发者编写动态SQL并将其与Java代码分离,简化了数据库操作。在日程表插件...

    ssh+extjs4.0grid删除数据

    Store与后台服务器通过Ajax请求进行交互,获取或更新数据。当你想要删除一条数据时,你需要触发Grid中的删除事件,这可以通过监听`itemcontextmenu`或者`rowdeselect`等事件来实现。 以下是一个基本的步骤概述: 1...

    Extjs Tree + JSON + Struts2

    4. **AJAX 技术**: 在这个项目中,ExtJS Tree 可能使用 AJAX(Asynchronous JavaScript and XML)技术异步地从服务器获取 JSON 数据,这使得用户无需刷新整个页面就能更新树视图。通过 `Ext.Ajax.request` 或者 `Ext...

    ASP.net + Extjs 网站通用后台框架

    2. **AJAX+xml操作**:利用ASP.NET的AjaxControlToolkit或jQuery AJAX库,以及XML数据格式,实现异步数据传输和更新。这使得后台操作无需刷新整个页面,提高了用户交互体验。 3. **数据管理组件**:可能包含了ExtJS...

    ExtJs做的用户登陆!ASP后台

    ASP后台"这个主题中,我们将深入探讨如何使用ExtJS实现前端用户登录界面,并结合ASP(Active Server Pages)作为后台处理登录逻辑。 首先,让我们了解一下ExtJS中的用户登录界面构建。通常,登录界面会包含用户名和...

    Extjs3+MySQL后台数据库实现省份城市二级联动

    本文将深入探讨如何使用ExtJS 3结合MySQL来实现一个省份城市二级联动的前端与后台系统。 首先,ExtJS 3提供了丰富的组件和API,使得开发者可以轻松创建各种复杂的用户界面,如下拉菜单、表格、表单等。在这个案例中...

    Strust2+Json+ExtJs 6个程序代码(经典)

    2. **数据展示**:Struts2 Action处理后台数据,将结果转化为Json格式,ExtJS的Grid组件接收并展示这些数据。 3. **CRUD操作**:创建、读取、更新和删除操作的实现,Struts2处理HTTP请求和业务逻辑,Json传递CRUD...

Global site tag (gtag.js) - Google Analytics