`
jaky821
  • 浏览: 42547 次
  • 性别: Icon_minigender_1
  • 来自: contry
文章分类
社区版块
存档分类
最新评论

实现Ext的grid单元格数据过长换行显示

    博客分类:
  • ext
阅读更多
Grid的单元格对数据显示都是采用省略的办法来处理的,即内容长度超过单元格长度时自动隐藏超过的部分并使用省略号...来显示,这样虽然也很好,但有时我们可能还是希望它能完全的显示出来,即采用换行显示。

最简单的办法莫过于直接修改ext-all.css,但俺一般不像侵入ext的源文件,那就自己用别的方法实现吧。
方法其实也很简单,判断该grid是否需要换行显示。如果是则加上这段代码:

grid.store.on('load', function() {
    grid.el.select("table[class=x-grid3-row-table]").each(function(x) {
        x.addClass('x-grid3-cell-text-visible');
    });
});

CSS文件内容:


.x-grid3-cell-text-visible .x-grid3-cell-inner{overflow:visible;padding:3px 3px 3px 5px;white-space:normal;}
分享到:
评论
1 楼 aishangtao 2009-10-11  
如果是ext里面的 ext:qtip 怎么设置它数据过长自动换行显行了.

相关推荐

    Ext grid合并单元格

    根据提供的文件信息,我们可以深入探讨如何在 Ext JS 中实现 Grid 的单元格合并功能。此案例主要涉及到了自定义 GridView 的 `renderHeaders` 方法来达到单元格合并的目的,并且还涉及了模板(Template)的使用、...

    ext grid 显示数据

    "ext grid 显示数据"这一主题,是深入理解EXT JS开发的关键知识点之一,特别是在处理表格和列表展示时。在"LearningExtJS 第五章节的翻译"中,我们可以期待找到关于EXT JS Grid的详细讲解和实例应用。 EXT JS的Grid...

    Ext合并单元格

    它允许开发者将多个相邻的单元格合并成一个大单元格,使得数据显示更加清晰,提高用户阅读体验。在描述中提到的"源代码以及效果图都在",暗示我们有实际的示例代码和预览结果来辅助理解这一功能。 首先,我们要了解...

    ext grid 合并行

    在EXT JS框架中,Grid组件是一种非常常用的展示数据表格的方式,它提供了丰富的功能和灵活性。在某些场景下,用户可能需要合并行或列以更好地组织和呈现数据,例如在显示汇总信息或者创建复杂的报告时。"ext grid ...

    ext grid数据绑定

    在EXT JS这个强大的JavaScript框架中,EXT Grid是一个非常重要的组件,用于展示大量结构化数据,并提供了丰富的交互功能。本文将深入探讨"EXT Grid数据绑定"这一主题,包括数据查找和如何将查找结果重新填充到Grid中...

    ext grid json分页显示

    总结来说,"ext grid json分页显示"是通过EXT.js的Grid组件结合DWR的Ajax能力,实现前端数据的分页加载和显示。这种方式既提高了用户界面的响应速度,又有效管理了大数据量的显示,是现代Web应用中常用的数据展示...

    Ext Grid 导出Excel

    Ext Grid是Sencha Ext JS框架的一部分,它允许开发者创建可配置的表格视图,可以显示从服务器获取的数据。这些数据通常通过Ajax请求加载,然后由Grid的Store进行管理。Store可以与各种数据源(如JSON、XML)配合,...

    ext表格合并单元格的方法

    本文将详细介绍一种在Ext JS中实现数据单元格合并的方法,并通过示例代码来帮助开发者更好地理解和应用这一技术。 #### CSS样式调整 为了实现良好的视觉效果,在开始编写JavaScript代码之前,我们需要对CSS样式做...

    一个很好的EXTGRID实例

    5. **编辑功能**:EXTGRID可以配置为行编辑或单元格编辑模式,方便用户直接在网格中添加、修改和删除数据。 6. **扩展性**:EXTGRID支持各种插件和扩展,如工具栏、分组视图、拖放功能、树形网格等,增强功能和交互...

    ext grid 导出 excel

    5. **样式和格式处理**:EXT Grid中的数据显示有各种样式,如颜色、字体等。如果需要保留这些样式,可以使用XLSX.js的`cellStyles`选项。但是,这需要更复杂的处理,因为Excel的样式系统与EXT Grid的样式不完全相同...

    Ext自定义Grid Cell插件

    在Ext JS这个强大的JavaScript框架中,`Grid`是用于展示数据的一种常见组件,它提供了灵活的数据展示和操作功能。在实际开发中,我们有时需要在Grid的单元格(Cell)中添加更丰富的交互元素,例如输入框、下拉选择器...

    extjs中设置grid默认行高及换行

    Extjs 中想改变grid 行高,如果只是简单的设置了height的值是可以实现grid 的行高,但是如果使用了插件:rowexpander ,最出现新的问题。 感兴趣的朋友可以试试的。 此文档可以解决你的烦恼,为了找到资源下载,...

    基于EXT2.0.2表格间数据拖拽

    在这个特定的场景中,我们将探讨“基于EXT2.0.2表格间数据拖拽”的实现。 EXT2.0.2中的数据拖拽功能,主要是通过DragDrop(DD)和DragDropGroup(DDG)组件来实现的。DragDrop组件允许用户将元素从一个位置拖动到另...

    重绘ComBox控件实现换行 当文本达到一定长度时实现换行

    总结,实现ComBox控件在文本过长时换行主要涉及自定义绘制、文本测量、换行算法、消息处理及性能优化等多个方面。通过以上步骤,我们可以创建一个更加友好且可读性强的ComBox控件,提高用户界面的易用性。

    JSP中使用EXT实现grid table

    EXT Grid 是EXT JS中的一个核心组件,用于展示结构化数据,通常用于大数据集的显示和编辑。它支持分页、排序、过滤和自定义列功能,还可以与其他EXT组件(如表格)无缝集成。EXT Grid的核心特性包括: 1. 数据绑定...

    EXT grid导出EXCEL

    在EXT Grid中,用户常常需要将数据显示的数据导出到Excel文件中,以便于进一步的数据分析、存储或分享。本文将详细讲解EXT Grid如何实现Excel导出功能。 EXT Grid导出Excel功能的核心是利用浏览器的Blob对象和...

    Ext grid中渲染进度条,超帅 源码-----下载不扣分,回帖加1分,欢迎下载,童叟无欺。

    Ext grid中渲染进度条,超帅 源码-----下载不扣分,回帖加1分,欢迎下载,童叟无欺。Ext grid中渲染进度条,超帅 源码-----下载不扣分,回帖加1分,欢迎下载,童叟无欺。Ext grid中渲染进度条,超帅 源码-----下载不扣分...

    jsp 实现的 EXT Grid 导出excel 例子

    在本例中,我们将深入探讨如何使用JSP来实现EXT Grid的数据导出到Excel的功能。 EXT Grid是EXT JS框架中的一个核心组件,它提供了分页、排序、过滤、拖放等多种特性,用于展示结构化的数据。在实际应用中,我们经常...

    EXT GridPanel获取某一单元格的值

    在EXT GridPanel中,获取某一单元格的值是常见的操作,特别是在实现自定义事件处理或数据验证时。 在提供的代码段中,我们看到一个监听`cellclick`事件的例子,这是EXT GridPanel中用于捕获用户点击单元格时的事件...

    Ext Grid表格的自动宽度及高度的实现

    在探讨“Ext Grid表格的自动宽度及高度的实现”这一主题时,我们深入解析如何在Ext JS框架下,利用其强大的Grid组件自适应容器尺寸,实现表格宽度与高度的自动调整。这一技术对于构建响应式、用户友好的界面至关重要...

Global site tag (gtag.js) - Google Analytics