ExtJs 2.0 公司工程化应用的最佳实践五

责任不是你应该做的事情,而是你必须做的事情 -- 陈治文
本例子写的是 EXT 2.0的弹窗效果! 

服务器部分：

 var _http = new XMLHttp() ;
 
 var _return = _http.get("http://rss.sina.com.cn/news/china/focus15.xml") ;
 
 Write.writeXML(_return) ;

 

网页部分：

JS部分：

Ext.BLANK_IMAGE_URL = 'js/ext/resources/images/default/s.gif';
/********************************************************************************/
Ext.namespace("Ext.dojoChina.demo") ;

Ext.dojoChina.demo.NewsWindow = function(_record){
 var _me = this ;
  Ext.dojoChina.demo.NewsWindow.superclass.constructor.call(this, {
   title:_record.get("title"),
   width: 500,
   height:300,
   resizable:false,
   layout: "fit",
   plain:true,
   bodyStyle:"padding:5px;",
   buttonAlign:"right",
   buttons: [{
    text:"查看详细",
    handler:function(){
     window.open(_record.get("link")) ;
     _me.close() ;
    }
   },{
    text: "关 闭",
    handler:function(){
     _me.close() ;
    }
   }],
   items:{
                html:_record.get("description")
            }
  });
}
Ext.extend(Ext.dojoChina.demo.NewsWindow , Ext.Window) ;
/********************************************************************************/
Ext.onReady(function(){
    var _grid = new Ext.grid.GridPanel({
        ds: new Ext.data.Store({
    proxy: new Ext.data.HttpProxy({
     url: "../app/demo.asp"
    }),
    reader: new Ext.data.XmlReader({
        record: "item"
       }, [
        {name: "title", mapping: "title"},
        {name: "datetime", mapping: "pubDate"},
        {name:"link" , mapping:"link"},
        {name:"description" , mapping:"description"}
       ])
   }),
        cm: new Ext.grid.ColumnModel([
   {header: "新闻名称", width: 300, dataIndex: "title"},
   {header: "新闻发布时间", width: 130, dataIndex: "datetime" , renderer: function(_value){
    var _date = new Date(_value) ;
          return _date.format("Y-m-d H:i:s");
   }}
  ]),
    sm: new Ext.grid.RowSelectionModel({singleSelect:true}),
       renderTo:"example_grid",
        width:500,
        height:300,
  loadMask: true
    });
    _grid.getStore().load();
 _grid.on("rowdblclick" , function(_grid){
   var _record = _grid.getSelectionModel().getSelected() ;
   var _window = new Ext.dojoChina.demo.NewsWindow(_record) ;
   _window.show() ;
 }) ;
}) ;

和前几例 最显著的差别还是js部分: 相同的部分都是采用同一框架!这样的好处是?

 

描述	EXT2.0的rss案例
技术	aspserver,EXT2.0
	下载

在线浏览: http://news.dojochina.com/document/html/demo3.html

 

配置房间见 :