EXT动态添加组件 .pdf

这种常见应用

布局：

Grid分页

级联：

代码如下：

/*

*ExtJSLibrary2.0.2

*Copyright(c)2006-2008,ExtJS,LLC.

********************

*

*

*/

Ext.onReady(function(){

//exampleofcustomrendererfunction

functionstatusColor(val){

if(val==在线){

returnspanstyle=color:green;+val+/span;

}elseif(val==会议中){

returnspanstyle=color:red;+val+/span;

}

returnval;

}

//createtheDataStore

varstore=newExt.data.Store({

url:termSearch.action,

storeId:searchResult,

//createreaderthatreadstheTopicrecords

reader:newExt.data.JsonReader({

totalProperty:totalrows,

root:data,

fields:[

{name:id,type:int},

consumer,

area,

termid,

name,

status,

udate

]

})

//turnonremotesorting

//remoteSort:true

});

varsm=newExt.grid.CheckboxSelectionModel();//多选行

varcm=newExt.grid.ColumnModel([

newExt.grid.RowNumberer(),

sm,

{header:序号,width:40,dataIndex:id},

{header:用户,width:50,dataIndex:consumer},

{header:地域,width:50,dataIndex:area},

{header:终端编号,dataIndex:termid},

{header:终端名称,dataIndex:name},

{header:终端状态,dataIndex:status,renderer:statusColor},

{header:更新日期,dataIndex:udate}

]);

//cm.defaultSortable=true;

//bydefaultcolumnsaresortable

cm.defaultSortable=true;

vargrid=newExt.grid.GridPanel({

store:store,

cm:cm,

stripeRows:true,

height:350,

width:800,

title:,

tbar:newExt.PagingToolbar({

pageSize:10,

width:98%,

store:store,

//paramNames:{rowStart:start,row