`
ForgetLove
  • 浏览: 24472 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

ajax的同步/异步请求,以及extjs4中如何在model中实现两张无外键关联表的查询操作

阅读更多

首先,讲下同步和异步的区别。

其实之前我也是很模糊的,现在似乎明白了,下面说下我的理解。

首先,说异步的好了。

var jszz = "";

Ext.Ajax.request({

       ',

       params:{q_jgbh:jgid},

       success:function(response){

       var result = Ext.decode(response.responseText);

       var data = result.data;

       var d = data[0];

       jszz = d.szz;//d.zz是返回的数据实体中的一个属性

     }

});

alert(jszz);

 

ajax请求外面声明一个jszz,初始值为空。然后发送ajax请求,在ajax里面为jszz重新赋值,然后在ajax请求外面alertjszz),但是alert出来的值仍然为空,不会受jszz = d.szz;影响.因为是异步的,所以ajax发送请求的同时,alert不会等待ajax请求完成再执行。所以,异步请求无法得到请求里面的数据(值).

 

而同步就不同了。同步就像接力赛,下一位接力人员需要等待前面一位的人把棒子传给他(相当于等待ajax请求完成后),再继续进行下一个传棒动作。所以,同步请求可以得到请求里面的值。

Ok,下面就说一下如何设置同步/异步请求。

request里面添加下面一行代码即可。

async:false,   //同步为false

 

 

下面就分享一个extjs4中一个小例子

 

 

如图,查询的是一张表中的数据,这个序号列的值引用的是另一张表的中的值,现在,使用model中的convert方法和ajax同步请求,完成显示序号列序号数字变汉字。在数据库中这两张表是没有外键引用关系的。虽然序号是从那张表查出来的值。

分享代码......

extend: 'Ext.data.Model',

    fields: [

{name: 'jgbh'}, 

{name: 'xh',convert:function(val){

     var da = '';

     Ext.Ajax.request({

     async:false,//同步请求,以便进行赋值操作

    method:'post',

     '你的url',

     params:{q_xh:val},//进行传参,以便进行查询相关数据

     success:function(response){

          var result = Ext.decode(response.responseText);

          var data = result.data;

          var d = data[0];

          da = d.sm;

     }

     });

     return da;//一定要返回,要不然就不会是另一张表的值了

}}, 

{name: 'szz'}, 

{name: 'zhy'}, 

{name: 'bz'} 

    ]

分享到:
评论

相关推荐

    extjs3.0 ajax 同步请求

    在 ExtJS 3.0 中实现同步 AJAX 请求通常有两种方法:一种是利用原生的 XMLHttpRequest 对象;另一种是使用 Ext.Ajax.request 方法,并通过配置选项来实现。 ##### 1. 原生 XMLHttpRequest 实现 ```javascript var ...

    extjs ajax同步请求所需js

    在ExtJS中,Ajax(异步JavaScript和XML)请求是数据交互的核心部分,用于与服务器进行通信,获取或更新数据。Ajax请求使得页面无需刷新即可更新部分内容,提高了用户体验。 标题中提到的"extjs ajax同步请求所需js...

    ExtJs Ajax 同步问题

    在ExtJS中,Ajax请求主要通过`Ext.Ajax`对象来实现。`Ext.Ajax.request()`方法是进行Ajax请求的核心函数,它接受一系列参数,包括URL、方法(GET或POST)、请求数据、回调函数等。同步与异步的控制则通过`async`参数...

    ExtJs异步请求和特殊用途

    在ExtJS中,异步请求(通常指的是Ajax请求)是实现动态数据加载、用户界面更新等关键功能的基础。Ajax框架允许开发者在不刷新整个页面的情况下与服务器进行通信,从而提供更流畅的用户体验。 1. **异步请求原理**:...

    Ext.Ajax.request2.x实现同步请求

    在EXTJS库中,`Ext.Ajax.request`是用于发送Ajax请求的核心方法,它支持异步和同步操作。本文将详细解析如何利用`Ext.Ajax.request`实现同步请求,并探讨其背后的原理和注意事项。 首先,我们需要理解Ajax的本质,...

    ExtJS的.NET控件_YuiGrid(数据绑定.同步_异步取值)

    在.NET环境中,可以使用ASP.NET AJAX UpdatePanel或自定义WCF服务来实现异步数据获取。YuiGrid的Store组件配置了proxy属性,可以设置为ScriptProxy或JsonPProxy,与服务器端进行异步通信。 5. **示例代码** 在`...

    ext-basex.js 进行Ext.Ajax.request 同步请求 FF无法正常

    在处理异步和同步请求时,Ext.Ajax是ExtJS中的一个关键组件。标题提到的"ext-basex.js进行Ext.Ajax.request同步请求 FF无法正常"问题,涉及到浏览器兼容性和异步/同步请求的理解。 `Ext.Ajax.request`是ExtJS中的一...

    Extjs4树结构异步加载

    在ExtJS4中实现树结构的异步加载,主要涉及以下几个关键概念: 1. **TreeStore**: TreeStore是树结构的数据源,它负责管理与服务器之间的数据通信。对于异步加载,我们需要配置TreeStore,设置`autoLoad`为`false`...

    extjs4中文文档

    10. **拖放功能**:EXTJS4支持拖放操作,用户可以轻松实现组件间的拖放行为,如在数据网格中的行排序。 11. **国际化支持**:EXTJS4内置了多语言支持,方便开发多语言版本的应用。 12. **响应式设计**:EXTJS4的...

    extjs对ajax的支持文档

    在ExtJS中,Ajax支持是核心功能之一,它使得在浏览器端与服务器进行异步通信成为可能,无需刷新整个页面。以下是对Ajax支持的详细说明: 1. **Ajax基础**: - Ext.Ajax是ExtJS中的核心模块,用于处理所有与Ajax...

    ExtJS构造动态异步加载

    本文将深入探讨如何使用ExtJS构建动态异步加载的树形结构,结合AJAX技术实现JSON数据的高效传输。 首先,我们要理解什么是动态异步加载。在传统的网页开发中,如果一次性加载所有数据,可能会导致页面加载速度慢,...

    extjs ajax tree(js动态树,无需递归)

    ExtJS AJAX Tree是一种...总的来说,ExtJS AJAX Tree是构建动态、交互式树形界面的强大工具,通过AJAX实现异步加载,可以有效优化大型数据集的展示性能。通过深入理解和实践,你可以创建出满足各种需求的复杂树形视图。

    extjs中文教程 ajax

    在ExtJS中,Ajax请求通常通过`Ext.Ajax`对象或者组件的`ajax`方法来实现。你将了解如何设置请求参数,处理响应,以及错误处理。 Java后端的交互通常是通过HTTP请求完成的。ExtJS提供了`Ext.data.Proxy`类,如`Ext....

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

    在IT行业中,构建高效、交互性强的Web应用是至关重要的,而"extjs4.2+ibatis+struts构建的ajax日程表插件"就是这样一个实例,它结合了前端框架EXTJS 4.2、后端MVC框架Struts以及持久层框架iBATIS,实现了基于Ajax的...

    extjs tree 异步加载树型

    在 ExtJS Tree 中实现异步加载,主要涉及以下几个关键点: 1. **TreeStore**:存储树节点数据的模型,可以配置 `proxy` 来指定数据来源。对于异步加载,一般使用 `ajax` 类型的 proxy,并设置 `url` 参数指向服务器...

    在Extjs中使用ajax传参到php中

    EXTJS中的`Ext.Ajax`类提供了异步发送Ajax请求的能力,它封装了原生的XMLHttpRequest对象,简化了API接口,允许我们更便捷地处理JSON、XML等数据格式。 2. **使用方法**: 要发送一个Ajax请求,你可以创建一个`...

    ajax框架之extjs2.0

    拖放功能在ExtJS 2.0中得到了很好的支持,可以方便地实现组件之间的拖放操作,提升用户体验。 **9. Theme和皮肤** ExtJS 2.0提供了多种主题,允许开发者改变应用的整体外观。开发者也可以自定义皮肤,满足特定的...

    tree 动态树 extjs ajax

    动态树通常通过Ajax请求来获取并填充数据,从而实现异步加载,提高页面性能。这种特性使得树结构在不阻塞用户界面的情况下,能够逐步加载子节点,减少了初次加载时的数据量。 **ExtJS TreePanel** 在ExtJS中,动态...

    ExtJS3 实现异步下拉树

    在ExtJS 3中,实现异步下拉树涉及到几个关键概念和技术。 首先,理解“异步”意味着数据不是一次性加载完毕,而是按需加载。在下拉树中,当用户展开树节点时,只加载该节点及其子节点的数据,这减少了初始页面加载...

    Extjs 自定义树结构实现以及动态表头实现

    在本文中,我们将深入探讨如何使用ExtJS框架来实现自定义树结构以及动态表头的功能。ExtJS是一款强大的JavaScript库,常用于构建富客户端应用程序,它提供了丰富的UI组件和强大的数据绑定机制。VS2015是Visual ...

Global site tag (gtag.js) - Google Analytics