Ext.grid.ColumnModel 显示不正常 求救!

java初学者好吧 2009-02-19 04:11:03
如图:

源代码为修改的http://extjs.org.cn/extjs/examples/grid/paging.html的代码:

<script type="text/javascript">
Ext.BLANK_IMAGE_URL = '../ext/resources/images/default/s.gif';

Ext.onReady(function(){

// create the Data Store
var store = new Ext.data.Store({
// load using script tags for cross domain, if the data in on the same domain as
// this page, an HttpProxy would be better
proxy: new Ext.data.ScriptTagProxy({
url: '../action.php?action=getLogs'
}),

// create reader that reads the Topic records
reader: new Ext.data.JsonReader({
root: 'topics',
totalProperty: 'totalCount',
id: 'threadid',
fields: [
'id', 'module', 'description',
{name: 'time', mapping: 'time', type: 'date', dateFormat: 'timestamp'}
]
}),

// turn on remote sorting
remoteSort: true
});
store.setDefaultSort('id', 'desc');

// pluggable renders
//function renderTopic(value, p, record){
// return String.format(
// '<b><a href="http://extjs.com/forum/showthread.php?t={2}" target="_blank">{0}</a></b><a href="http://extjs.com/forum/forumdisplay.php?f={3}" target="_blank">{1} Forum</a>',
// value, record.data.forumtitle, record.id, record.data.forumid);
//}
function renderTime(value, p, r){
return String.format('{0}<br/>by {1}', value.dateFormat('M j, Y, g:i a'), r.data['time']);
}

// the column model has information about grid columns
// dataIndex maps the column to the specific data field in
// the data store
var cm = new Ext.grid.ColumnModel([{
id: 'id', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
header: "序号",
dataIndex: 'id',
width: 70
},{
header: "模块",
dataIndex: 'module',
width: 150
},{
header: "内容",
align : 'center',
sortable : false,
dataIndex: 'description',
width: 700,
align: 'right'
},{
id: 'time',
header: "日期",
dataIndex: 'time',
width: 120,
renderer: renderTime
}]);

// by default columns are sortable
cm.defaultSortable = true;

var grid = new Ext.grid.GridPanel({
el:'topic-grid',
width:1050,
height:640,
title:'',
store: store,
cm: cm,
trackMouseOver:false,
sm: new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
//loadMask: true,
viewConfig: {
forceFit:true,
enableRowBody:true,
showPreview:true,
getRowClass : function(record, rowIndex, p, store){
if(this.showPreview){
p.body = '<p>'+record.data.excerpt+'</p>';
return 'x-grid3-row-expanded';
}
return 'x-grid3-row-collapsed';
}
},
bbar: new Ext.PagingToolbar({
pageSize: 25,
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display",
items:[
'-', {
pressed: true,
enableToggle:true,
text: 'Show Preview',
cls: 'x-btn-text-icon details',
toggleHandler: toggleDetails
}]
})
});

// render it
grid.render();

// trigger the data store load
store.load({params:{start:0, limit:25}});

function toggleDetails(btn, pressed){
var view = grid.getView();
view.showPreview = pressed;
view.refresh();
}
setTimeout(function() {
Ext.get('loading-mask').fadeOut({
remove : true
});
}, 300);
loadend();
});
</script>
...全文
716 1 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
朱帝11 2012-03-02
  • 打赏
  • 举报
回复
仔细看看标点符号吧

87,997

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧