锁定老帖子 主题:把JS代码和Ext框架运行在服务器端?
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
---|---|
作者 | 正文 |
发表时间:2008-06-17
服务器端跑javascript ?还记得asp的这个<script language=javascript runat=server>吗~ 下面用Ext在服务器端运行一下,体验一下你熟悉的js的强大功能吧。 Jaxer促进了服务器端和客户端的紧密结合,你可以包含服务器端的js,也可以包含客户端的js,也可以2者都包含。服务器充当一个中间代理,使得可以良好的处理同步和异步的通信。Jaxer现在提供了一个文本的数据库甚至是socket,这使它看上去更像是真证的服务器端运行平台。你可以及时关注他的官网 Aptana Jaxer,及时了解最近的服务器端运行JavaScript的技术。 利用Jaxer存储数据并用Ext Grid显示出来 点这里下载全部示例源代码如果你想自己安装个Jaxer平台进行测试,第一个示例展示了一个非常简单的Ext.data.Store以及Jaxer server存储的代码。 JaxerStoreServer.js 包含了简单的服务器端的函数,用来创建和执行一个查询。前提是建立在你已经配置好了Jaxer的config.js指向一个数据库。 function ExtJaxerProxy(params) { var fld = [], q = []; var fields = params.fields; for (var i = 0; i < fields.length; i++) { if (typeof fields[i] == 'string') { fld.push(fields[i]); q.push('?'); } else if (typeof fields[i] == 'object') { fld.push(fields[i].name); q.push('?'); } } var qp = fld; var query = 'SELECT ' + fld.join(',') + ' FROM ' + params.table; if (params.sortInfo) { query += ' ORDER BY ' + params.sortInfo.sort + ' ' + params.sortInfo.dir; qp.push(params.sortInfo.sort); qp.push(params.sortInfo.dir); } if (params.start && params.limit) { query += ' START ' + params.start + ' LIMIT ' + params.limit; qp.push(params.start); qp.push(params.limit); } return Jaxer.DB.execute(query); } JaxerStore.js 包含了简单的Ext data链接到Jaxer,并存储数据。 Ext.data.JaxerStore = function(config) { var params = Ext.apply({ fields : config.fields, table : config.table }, config.baseParams || {}); Ext.data.JaxerStore.superclass.constructor.call(this, Ext.applyIf(config, { reader : new Ext.data.JsonReader(Ext.apply({ root : 'rows' }, config.readerConfig), config.fields) })); ExtJaxerProxyAsync(this.loadData.createDelegate(this), params); }; Ext.extend(Ext.data.JaxerStore, Ext.data.Store);
确保这两个文件都包含在你的网页里,Ext.JaxerStore运行在客户端,JaxerStoreServer以一个'server-proxy’运行。这里我们创建一个Jaxer存储,然后创建一个简单的Ext GridPanel并把JaxerStore数据给它。 Ext.onReady(function() { var store = new Ext.data.JaxerStore({ table : 'demo', fields : [ {name : 'name'}, {name : 'phone'}, {name : 'email'} ], readerConfig : { sortInfo : { sort : 'name', dir : 'asc' } } }); // create the Grid var grid = new Ext.grid.GridPanel({ store : store, columns : [ {header : "Name", sortable : true, dataIndex : 'name'}, {header : "Phone #", sortable : true, dataIndex : 'phone'}, {header : "Email", sortable : true, dataIndex : 'email'} ], viewConfig : { forceFit : true }, stripeRows : true, height : 350, width : 680, title : 'Jaxer Demo Grid', renderTo : Ext.getBody() }); }); 出来效果是这样儿的。
|
|
返回顶楼 | |
浏览 2438 次