1.EXTJS Row Editor Grid 点取消时插入的新行 的解决方法

1.EXTJS  Row Editor Grid  点取消时插入的新行 的解决方法 

    <link rel="stylesheet" type="text/css" href="/public/css/RowEditor.css" />

<script type="text/javascript" src="/public/js/Plugins/RowEditor.js"></script>

将新增 删除放到行后面。  

{header: '操作',

dataIndex: 'opt',

name:'opt',

align: 'center',

width: 100,

renderer:function(val, metadata, record, rowIndex, colIndex, store){ 

var grid_id=this.name; 

return  "<input type='button' style='background-Color:#FFF;border:0;font-size: 12px;'  value='新增' onclick='add_row("+rowIndex+",\""+grid_id+"\");'/> " +"<input type='button'  style='background-Color:#FFF;border:0;font-size: 12px;' value='删除'  onclick='del_row(\""+grid_id+"\");'/>";

 }

外部函数

function add_row(Index,grid_id) {

    var grid = Ext.getCmp(grid_id);

    grid.addRow(Index);

}

function del_row(grid_id) {

    var grid = Ext.getCmp(grid_id);

    grid.isEdit = false;

    grid.delRow(true);

}

初始化时的函数 控制内的函数。

addRow : function(Index){

        var Employee = Ext.data.Record.create([{

                name: 'id'

            }]);

var u = new Employee({

id: ""  

});

this.editor.stopEditing();

this.store.insert(Index+1,u);  //在当前行的下一行插入

this.getView().refresh();

this.getSelectionModel().selectRow(Index+1);

this.editor.startEditing(Index+1);

},

delRow:function(){

this.editor.stopEditing();

        if(!this.isEdit) {

            if(this.store.getCount() != 1)

            {

                var rec = this.getSelectionModel().getSelected();

                this.store.remove(rec);

                this.getView().refresh();

            }else{

                alert('至少要有一个属性。')

            }

        }

}

New一个编辑的面板

 var editor = new Ext.ux.grid.RowEditor({

clicksToEdit : 2,  //去掉单击编辑情况

saveText: '确定' ,

            cancelText: '取消',

            onRowDblClick: function(g, rowIndex, e){

                this.startEditing(rowIndex, false);

                this.doFocus.defer(this.focusDelay, this, [e.getPoint()]);

                _this.isEdit = true;  //双击的时候设置为true 利用这个来控制取消的时候不删除。

            },

            listeners : {

                canceledit : function(re,isPress){

                    if(isPress){

                        _this.delRow();  点击取消时调用删除方法。防止插入的行留空问题

                    }

                } 

            }

});