ExtJS2.0实用简明教程——与服务器交互

最新推荐文章于 2024-11-16 12:07:10 发布

impeller

最新推荐文章于 2024-11-16 12:07:10 发布

阅读量1.9k

点赞数

分类专栏： EXT2 文章标签： extjs 服务器 url email list function

EXT2 专栏收录该内容

54 篇文章 0 订阅

订阅专栏

在实际的应用中，表格中的数据一般都是直接存放在数据库表或服务器的文件中。因此，在使用表格控件的时候经常需要与服务器进行交互。ExtJS使用Ajax方式提供了一套与服务器交互的机制，也就是可以不用刷新页面，就可以访问服务器的程序进行数据读取或数据保存等操作。
比如前面在表格中显示xml文档中数据的例子中，就是一个非常简单的从服务器端读取数据的例子，再回顾一下代码：

var store=new Ext.data.Store({

url:"hello.xml", 

reader:new Ext.data.XmlReader({

record:"row"},

["id","name","organization","homepage"])

});

因为Sote组件接受一个参数url，如果设置url，则ExtJS会创建一个与服务器交互的Ext.data.HttpProxy对象，该对象通过指定的Connection或Ext.Ajax.request来向服务端发送请求，从而可以读取到服务器端的数据。
经验表明，服务器端产生JSon数据是一种非常不错的选择，也就是说假如服务器的url“student.ejf?cmd=list”产生下面的JSON数据输出：

{results:[{id:1,

name:'小王',

email:'xiaowang@easyjf.com',

sex:'男',

bornDate:'1991-4-4'},

{id:1,

name:'小李',

email:'xiaoli@easyjf.com',

sex:'男',

bornDate:'1992-5-6'},

{id:1,

name:'小兰',

email:'xiaoxiao@easyjf.com',

sex:'女',

bornDate:'1993-3-7'} 

]

}

则前面显示学习信息编辑表格的store可以创建成下面的形式：

var store=new Ext.data.Store({

url:"student.ejf?cmd=list", 

reader:new Ext.data.JsonReader({

root:"result"},

["id","name","organization","homepage"])

}); 

或者：

var store=new Ext.data.JsonStore({

url:"student.ejf?cmd=list", 

root:"result",

fields:["id","name","organization","homepage"]});

其中root表示包含记录集数据的属性。
如果在运行程序中需要给服务器端发送数据的时候，此时可以直接使用ExtJS中提供的Ext.Ajax对象的request方法。比如下面的代码实现放服务器的student.ejf?cmd=save这个url发起一个请求，并在params中指定发送的Student对象：

function sFn()

{

alert('保存成功');

}

function fFn()

{

alert('保存失败');

}

Ext.Ajax.request({

   url: 'student.ejf?cmd=save’

   success: sFn

   failure: fFn,

   params: { name: '小李',email: ' xiaoli@easyjf.com',bornDate: ' 1992-5-6',sex: '男'}

});

关于ExtJS中各控件与服务器端如何交互、Ext.Ajax的详细使用说明等请参考wlr.easyjf.com中的VIP文档《ExtJS中客户端控件与服务器控件交互详解》。

上一篇：可编辑表格EditorGridPanel

(阅读 <script language="javascript" src="/blog.ejf?cmd=visitBlogDoc&docId=1179668" type="text/javascript"></script> 448) 评论数(： 3)

【评论】【收藏】

评论：共3条

发表评论

请问，如下取得一个store对象之后， var store=new Ext.data.JsonStore({ url:"student.ejf?cmd=list", root:"result", fields:["id","name","organization","homepage"]}); 如果不应用于grid中，我如何才能取得store中的数据？

评论人: realsmy 评论时间: 2008-02-19 08:38:28

关于这个问题，请看数据存储一章中的介绍。

评论人: 冷雨评论时间: 2008-02-20 18:42:37

关于ExtJS中各控件与服务器端如何交互、Ext.Ajax的详细使用说明等请参考wlr.easyjf.com中的VIP文档《ExtJS中客户端控件与服务器控件交互详解》。这个如何得到呢？