`
solon.jar
  • 浏览: 44753 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

Ext GridPanel 自定义列的Render

阅读更多

 

colMap: { id : 'invoiceListForDetail',

            columns: [

                {header: "票据ID",   dataIndex: 'tobaccoBizAuditId', hidden: true},

                {header: "发票编号",  dataIndex: 'invoiceNo'},

                {header: "开单时间",  dataIndex: 'invoicingDate'},

                {header: "重量",     dataIndex: 'weight'},

                {header: "金额",     dataIndex: 'amount'},

                {header: "审核状态",  dataIndex: 'auditIsSucc', renderer: auditStateRender}

            ]

}

 

 

定义renderer 方法

 

 

 

var auditStateRender = function(value){

    if (value == "0")

        return "未审核";

    else

        return "已审核"; 

}

 

 

Ext在调用renderer 方法时, 会向该方法传递以下参数:

 

 

ext api doc :

value : Object
单元格的数据值。The data value for the cell.

metadata : Object
单元格元数据(Cell metadata)对象。你也可以设置下列的属性:

        css : String 
        单元格CSS样式字符串,作用在td元素上。 

        attr : String 
        一段HTML属性的字符串,将作用于表格单元格内的数据容器元素(如'style="color:red;"')。

record : Ext.data.record
从数据中提取的Ext.data.Record。


rowIndex : Number
行索引。Row index

colIndex : Number
列索引。Column index

store : Ext.data.Store
从Record中提取的Ext.data.Store对象。The Ext.data.Store object from which the Record was extracted.



 

 

renderer方法中返回(return)的处理结果便是最终被显示在列上的数据.

 

 

 

 

分享到:
评论

相关推荐

    Ext 实现自定义控件

    在 `PersonListGridPanel` 示例中,我们创建了一个新的 `GridPanel` 组件,它包含了自定义的配置项,如渲染位置、大小、标题栏按钮以及列设置等。`constructor` 函数接收一个URL参数,但在这个示例中并未使用。通常...

    EXTJSEXT实例GridPanel.

    renderTo: Ext.getBody() // 渲染到页面的body元素 }); ``` 此外,EXTJS的GridPanel还支持许多高级特性,例如: - **行编辑**: 可以通过添加RowEditor插件实现单元格级别的编辑。 - **分页**: 使用PagingToolbar...

    可编辑表格Ext.grid.EditorGridPanel

    2. Ext.grid.EditorGridPanel:EditorGridPanel是Ext JS中的一种网格组件,它扩展了GridPanel,增加了单元格级别的编辑功能。用户可以直接在表格中修改数据,而无需跳转到单独的编辑页面。 二、核心特性 1. 可编辑...

    Ext2.0示例讲解

    在描述中提到,Ext2.0的Grid控件不仅美观,还支持多种数据格式,如二维数组、JSON和XML,甚至允许自定义数据类型。 Grid的核心组成部分包括ColumnModel(列模型)和Store(数据存储)。ColumnModel定义了表格的结构...

    Ext2.1API中文文档

    例如,`Ext.grid.GridPanel` 是一个常用的组件,用于显示数据网格,而`Ext.tree.TreePanel`则用于展示层次结构的数据。 工具类是Ext JS中的另一个重要部分,它们提供了各种实用函数,如DOM操作、动画效果、事件处理...

    EXT 时间控件 3.0以上使用

    EXT时间控件可以轻松与其他EXT组件(如GridPanel、FormPanel等)集成,用于数据表单的输入或展示。同时,EXT支持Ajax和服务器端的数据交互,因此DateTimeField也能方便地配合服务器端进行数据验证和存储。 6. **...

    ExtJS 配置和表格控件使用

    4. **创建Grid Panel**:最后,使用上述配置创建GridPanel,指定渲染位置、数据存储、列模型和高度等属性: ```javascript var grid = new Ext.grid.GridPanel({ renderTo: "grid", store: ds, height: 600, ...

    第三方控件Coolite使用教程

    Ext2.0是一个JavaScript库,它提供了强大的数据展示能力,支持多种数据格式,如二维数组、JSON、XML,以及自定义数据类型。关键在于Ext.data.Store,它作为中间层,将各种格式的数据转化为Grid可以处理的形式。 ...

    Extjs4下拉菜单ComboBox中用Grid显示通用控件

    - 当 `ComboBox` 的下拉列表需要展示复杂数据结构时,如多列或带有自定义样式的数据,可以使用 `GridComboBox`。 - `GridComboBox` 可以设置为单选或多选模式,根据业务需求选择合适的交互方式。 4. **配置与实现...

    ExtJS的使用方法汇总--doc文档

    var grid = new Ext.grid.GridPanel({ store: store, cm: cm, renderTo: Ext.getBody() // 渲染到body元素 }); ``` 最后,通过调用`grid.render()`方法或直接指定渲染位置(如`renderTo: Ext.getBody()`)将Grid...

    extjs模仿excel效果

    综上所述,通过利用ExtJS的GridPanel、Store、CellEditing插件以及自定义的JavaScript逻辑,我们可以构建出一个类似于Excel的交互式表格。尽管它无法完全替代Excel的强大功能,但对于Web应用程序来说,这样的实现...

    gridpanel动态加载数据的实例代码

    4. **RenderTo**: `'tagModelManager_tagModelDiv'` - 指定`GridPanel`将渲染到哪个DOM元素。 5. **LoadMask**: `{msg: '正在加载数据,请稍候....'}` - 当数据加载时,显示一个遮罩提示用户数据正在加载。 6. **...

    extjs3.4如何创建对象

    这里,`Ext.extend()`用于扩展`Ext.Panel`类,并添加自定义配置。然后通过`new`关键字创建实例。 2. 配置项(Configurations): EXTJS允许通过配置项来定制对象。在上面的例子中,`title`、`width`和`height`就是...

    找到的ExtJS实现多选下拉框3个代码

    renderTo: Ext.getBody() }); } }); ``` 2. **使用Chained Combo实现多选** 另一种实现多选下拉框的方法是使用Chained ComboBox。这种组件允许从一个主下拉框中选择多个项目,然后将这些项目显示在一个子下拉框...

    轻松搞定Extjs_原创

    五、自定义消息框 24 六、进度条对话框 25 七、让消息框飞出来 26 八、小结 27 第五章:页面与脚本完全分离 28 一、Extjs是脚本的世界 28 二、Ext.onReady事件 28 三、来自Extjs的问候 29 四、让界面动起来 29 五、...

    基于EXTJS简明教程2.0的笔记

    19. **Ext.grid.EditorGridPanel** 是可编辑的GridPanel,通过在`ColumnModel`中为列添加编辑器(如`TextField`)实现数据的编辑,对于日期数据可能需要使用特定的编辑器如`DateField`。 EXTJS的灵活性和强大功能使...

    extjs总结.docx

    它可以配置`renderTo`属性来决定渲染的位置,`frame`属性用来添加边框,以及其他如列定义、数据源等配置。 EXTJS的强大之处在于它的组件化和可配置性,通过组合不同的组件和设置,可以构建出功能丰富的应用程序。在...

    ExtJs使用过程中积攒的一些东西

    `renderTo`指定了渲染的容器ID,`enableTabScroll`开启滚动条,`autoTabs`自动创建Tab,`deferredRender`控制渲染时机,`activeTab`设定初始选中项,`animScroll`启用动画滚动,`layoutOnTabChange`在切换Tab时重新...

Global site tag (gtag.js) - Google Analytics