日期:2014-05-16  浏览次数:20491 次

Extjs4 RowEditing 的使用和更新方法

如何灵活快速的掌握RowEditing组件的应用,应大家的要求,今天给大家具体讲下该组件的使用。

1、创建

var rowEditing = Ext.create('Ext.grid.plugin.RowEditing',{
            pluginId:'rowEditing',
            saveBtnText: '保存',
            cancelBtnText: "取消",
            autoCancel: false,
            clicksToEdit:2   //双击进行修改  1-单击   2-双击    0-可取消双击/单击事件
});

2、定义使用插件

Ext.define('SubBody_Grid', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.SubBody_Grid',
        collapsible: false,
        iconCls: 'icon-grid',
        //frame: true,           //显示Grid整个框架
        height: window.innerHeight,
        border: true,
        loadMask: true,
        columnLines: true,    //显示列线
        selType: 'rowmodel',
        plugins: [rowEditing],      //定义使用插件

        columns: [
             {
                dataIndex: "Partno",
                width: 100,
                sortable: true,
                //flex: 1        // grid宽度减去固定列宽以后占一份;
                text: '物料编号'
            }, {
                dataIndex: "PurQty",
                width: 70,
                editor: 'numberfield',                    //在需要更改的字段设置编辑,并指明类型
                renderer: Ext.util.Format.numberRenderer('0.00'),
                align: 'right',
                sortable: true,
                text: '采购数量'
            }, {
                dataIndex: "DeliveryDate",
                width: 90,