Ext Grid上的单击以及双击事件

Ext Grid上的单击以及双击事件

博客分类： 

extjs学习EXTBlogIDEAHTML 

进来项目中需要使用双击/单击行记录来获取数据，将实现的方式记录如下：

Java代码  


1、双击     

var cb = new Ext.grid.RowSelectionModel({     

    singleSelect:true //如果值是false，表明可以选择多行；否则只能选择一行     

});     

    

var alarmGrid = new Ext.grid.GridPanel({     

    

}     

alarmGrid.addListener('rowdblclick', rowdblclickFn);     

    

function rowdblclickFn(grid, rowindex, e){     

    grid.getSelectionModel().each(function(rec){     

    alert(rec.get(fieldName)); //fieldName，记录中的字段名     

    });     

}     

    

2、单击     

var cb = new Ext.grid.RowSelectionModel({     

    singleSelect:true //如果值是false，表明可以选择多行；否则只能选择一行     

});     

    

var alarmGrid = new Ext.grid.GridPanel({     

    

}     

alarmGrid.addListener('rowclick', rowclickFn);     

    

function rowclickFn(grid, rowindex, e){     

    grid.getSelectionModel().each(function(rec){     

    alert(rec.get(fieldName)); //fieldName，记录中的字段名     

    });     

}    

 

 初始化时添加：以上那个是单独写的添加单击双击事件，主要使用addListener添加'rowclick'和'rowdblclick'代表单击和双击事件。而初始化配置，只要配置Grid里面的listeners就可以了！

Java代码  


var cb = new Ext.grid.RowSelectionModel({   

     singleSelect:true //如果值是false，表明可以选择多行；否则只能选择一行   

});   

  

var alarmGrid = new Ext.grid.GridPanel({  

  

}   

alarmGrid.addListener('rowclick', rowclickFn);   

  

function rowclickFn(grid, rowindex, e){   

     grid.getSelectionModel().each(function(rec){   

     alert(rec.get(fieldName)); //fieldName，记录中的字段名   

     });   

}   

  

var grid = new Ext.grid.GridPanel({  

   store: <your datastore>,  

   columns:[<your columns>],  

   renderTo:'example-grid',  

   height:200,  

   listeners:{  

//单击  

       rowdblclick : function(grid,row){  

           alert("rowdblclick")  

       },  

//双击  

       rowclick:function(grid,row){  

           alert('rowclick')  

       }  

   }  

});  

 

恩，我找了一些资料并且自己也实践了一下，的确能用！，大家互相学习吧

资料来源：

http://hi.baidu.com/k_boy/blog/item/da3f3afa86910b809e5146f9.html

http://marco--liu.iteye.com/blog/109181

http://qixiaopeng.iteye.com/blog/419155