首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Ajax >

怎么设置Ext GridPanel中的数据垂直方向居中

2013-07-16 
如何设置Ext GridPanel中的数据垂直方向居中?我的代码如下: {xtype : grid,id : grid_jglb,frame : tr

如何设置Ext GridPanel中的数据垂直方向居中?
我的代码如下:

 {
xtype : 'grid',
id : 'grid_jglb',
frame : true,
region : 'center',
title : '进度项详细信息',
columnLines : true,
loadMask : true,
store : 'uic11_010_qdlb_store',
viewConfig : {
forceFit : true,
scrollOffset : 0
},
anchor : '100%',
selModel : new Ext.grid.CheckboxSelectionModel({
moveEditorOnEnter : false,
width : 28
}),
columns : [{
xtype : 'gridcolumn',
align : 'center',
dataIndex : 'NAME',
editable : false,
header : '进度名称',
sortable : true,
width : 100
}, {
xtype : 'gridcolumn',
align : 'center',
dataIndex : 'SCH_MIN',
editable : false,
header : '最小进度',
sortable : true,
width : 100
}, {
xtype : 'gridcolumn',
align : 'center',
dataIndex : 'SCH_MAX',
editable : false,
header : '最大进度',
sortable : true,
width : 100
}, {
xtype : 'gridcolumn',
align : 'center',
dataIndex : 'ICON_FILE',
id : 'colidx1',
editable : false,
header : '进度图片',
sortable : true,
width : 100
}, {
xtype : 'gridcolumn',
align : 'center',
dataIndex : 'ICON_DETAIL_ID',
hidden : true,
sortable : true
}],
bbar : {
xtype : 'paging',
autoShow : true,
displayInfo : true,
pageSize : 10,
store : 'uic11_010_qdlb_store'
},
tbar : [{
text : '新增',
iconCls : 'icon-add',
id : 'btn_mxxz'
}, '-', {
text : '修改',
iconCls : 'icon-edit',
id : 'btn_mxxg'
}, '-', {
text : '删除',
iconCls : 'icon-delete',
id : 'btn_mxsc'
}]


}


怎么设置Ext GridPanel中的数据垂直方向居中
我想要让除了表头和图片外的数据都水平、垂直居中。应该怎么设置啊?求大大现身。 ExtJS 垂直居中
[解决办法]
<style>
.tdValign{vertical-align:middle}
</style>


需要垂直居中的设置tdCls:'tdValign'

columns : [{
                                xtype : 'gridcolumn',
                                align : 'center',tdCls:'tdValign',
                                dataIndex : 'NAME',
                                editable : false,
                                header : '进度名称',
                                sortable : true,
                                width : 100
                            }, {
                                xtype : 'gridcolumn',
                                align : 'center',

tdCls:'tdValign',
                                dataIndex : 'SCH_MIN',
                                editable : false,
                                header : '最小进度',
                                sortable : true,
                                width : 100
                            }, {
                                xtype : 'gridcolumn',
                                align : 'center',tdCls:'tdValign',
                                dataIndex : 'SCH_MAX',
                                editable : false,
                                header : '最大进度',
                                sortable : true,
                                width : 100
                            }, {


                                xtype : 'gridcolumn',
                                align : 'center',
                                dataIndex : 'ICON_FILE',
                                id : 'colidx1',
                                editable : false,
                                header : '进度图片',
                                sortable : true,
                                width : 100
                            }, {
                                xtype : 'gridcolumn',
                                align : 'center',
                                dataIndex : 'ICON_DETAIL_ID',
                                hidden : true,
                                sortable : true


                            }],
[解决办法]
4.1版本ext,chrome,firefox测试没问题,其他版本的ext自己找对应的配置。

以后问ext问题记得加版本,要不浪费大家的时间

想偷懒直接设置td样式,这样所有td都会垂直居中

td{vertical-align:middle}

热点排行