转帖自:http://blog.sina.com.cn/s/blog_57112b350100m0cu.html
GridPanel 单元格自动换行
定义列的时候加个 renderer,例
-
-
{
-
header:'序号',
-
dataIndex:'ind',
-
renderer:function(value,meta,record){
-
meta.attr='style="white-space:normal;"';
-
returnvalue;
-
}
-
}
使用自动换行又会带来一个新的问题,那就是不需要换行的列在竖直方向上没有居中显示,而是靠上对齐,要想在竖直方向上居中显示还得改下 grid 的样式,本人不赞成直接修改 ext-all.css,一个是尊重人家的版权,还有就是改多了,以后自己都记不清。那么要想改过成单元格都竖直居中,只需在页面或者自己的样式定义里面重写一个样式即可:
-
<styletype="text/css">
-
.x-grid3-rowtd,.x-grid3-summary-rowtd{
-
line-height:13px;
-
vertical-align:middle;
-
padding-left:1px;
-
padding-right:1px;
-
-moz-user-select:none;
-
-khtml-user-select:none;
-
-webkit-user-select:ignore;
-
}
-
</style>
其实看过原码就知道了,里面只有 vertical-align: middle; 才是设置对齐用的,其他的都是原来定义的样式,只是把这个对齐由原来的 top 改成了 middle 而已。这样就能既达到了有些列自动换行的目的,而且又不影响到 grid 的美观了。
转自:http://guozhenqian.iteye.com/blog/1225145
分享到:
相关推荐
该文档里面的代码能够完美解决extjs的桌面图标换行问题,我亲自试用过
Extjs 中想改变grid 行高,如果只是简单的设置了height的值是可以实现grid 的行高,但是如果使用了插件:rowexpander ,最出现新的问题。 感兴趣的朋友可以试试的。 此文档可以解决你的烦恼,为了找到资源下载,...
ExtJS grid过滤操作,可以动态操作本地的store更改筛选的内容
extjs grid示例代码extjs grid示例代码extjs grid示例代码extjs grid示例代码
extjs4.0 实现桌面图标换行,具体改动参考 4.0.2a\examples\desktop\App.js 核心方法参考这句 //这里初始化所有图标 this.initShortcut(); 我觉得我说的很清楚了,还不明白的留言,一点js不懂的请闪开,谢谢
ExtJs Grid是否选择行,是:返回选择行record;否:返回false
EXTJS grid导出EXCEL文件,源码可以直接导入MYECLIPSE使用,EXTJS版本3.2.0
extjs grid 多表头 插件 extjs grid 多表头 插件
很多同事在用extjs grid做分页的时候,往往会想用grid的多选功能来实现导出Excel之类的功能(也就是所谓的多选记忆功能),但在选选择下一页的时候 上一页选中的已经清除 这是因为做分页的时候又向服务器请求了分页...
这是利用sencha cmd 生成的GridFilterDemo工程中的app和build文件夹,其余文件过大并且与主题无关,因此未包含。具体方法,请参看我的博客: 《Extjs4.2 Grid Filter Feature 表格过滤特性》
Extjs动态Grid的生成 htm
extjs grid ide:myeclipse5.5 jboss4.2.1 extjs4.2.1
ExtJs grid多选时获取选中的所有值,以及其他相关的操作
ExtJs 4.0 Grid 单元格合并控件封装
这是一个简单的在extjs下的grid转化到Excel,里面代码简单易懂,在包里面还集成了复杂的js转化函数,不过本人没有用它来进行转化! 注:在用EXTJS的导出Excel技术中,一定要注意分页的问题
自己写的一个Extjs Grid2Grid拖拽
完美实现desktop桌面图标自动换行功能
EXTJS Grid布局总结例子,含源代码。
非常好的学习EXTJS Grid的教程,欢迎大学下载