ext使用ajax

使用Ajax
在弄好一些页面后，你已经懂得在页面和脚本之间的交互原理（interact）。接下来，你应该掌握的是，
怎样与远程服务器（remote server）交换数据，常见的是从数据库加载数据（load）或是保存数据（save）
到数据库中。通过JavaScript 异步无刷新交换数据的这种方式，就是所谓的Ajax。Ext 内建卓越的Ajax 支
持，例如，一个普遍的用户操作就是，异步发送一些东西到服务器，然后，UI 元素根据回应（Response）
作出更新。这是一个包含text input 的表单，一个div 用于显示消息（注意，你可以在ExtStart.html 中加入
下列代码，但这必须要访问服务器）：
<div id="msg" style="visibility: hidden"></div>
Name: <input type="text" id="name" /><br />
<input type="button" id="oKButton" value="OK" />
接着，我们加入这些处理交换数据的JavaScript 代码到文件ExtStart.js 中(用下面的代码覆盖)：
Ext.onReady(function(){
Ext.get('oKButton').on('click', function(){
var msg = Ext.get('msg');
msg.load({
url: [server url], //换成你的URL
params: 'name=' + Ext.get('name').dom.value,
text: 'Updating...'
});
msg.show();
});
});
这种模式看起来已经比较熟悉了吧！先获取按钮元素，加入单击事件的监听。在事件处理器中（event
handler），我们使用一个负责处理Ajax 请求、接受响应（Response）和更新另一个元素的Ext 内建类，称
作UpdateManager。UpdateManager 可以直接使用，或者和我们现在的做法一样，通过Element 的load 方
法来引用（本例中该元素是id 为“msg“的div）。当使用Element.load 方法，请求（request)会在加工处理后
发送，等待服务器的响应（Response）， 来自动替换元素的innerHTML。简单传入服务器url 地址，加上字
符串参数，便可以处理这个请求（本例中，参数值来自“name”元素的value),而text 值是请求发送时提示的
文本，完毕后显示那个msg 的div（因为开始时默认隐藏）。当然，和大多数Ext 组件一样，UpdateManager
有许多的参数可选，不同的Ajax 请求有不同的方案。而这里仅演示最简单的那种。