ExtJS4.2学习(12)基于表格的右键菜单

在实际的软件开发中，我们的grid表格为了方便用户通常会有一个右键菜单来实现对表格的增、删、改等操作，其实只需要2步就可轻松实现
第一、创建一个Ext.menu.Menu

//表格右键菜单 
    var contextmenu = new Ext.menu.Menu({ 
        id:'theContextMenu', 
        items:[{ 
            text:'查看详情', 
            handler:function(){ 
                Ext.Msg.alert("系统提示","测试"); 
            } 
        }] 
    });

第二、监听表格的Ext.menu.Menu事件

grid.on("itemcontextmenu",function(view,record,item,index,e){ 
        e.preventDefault(); 
        contextmenu.showAt(e.getXY()); 
    });

K，一切大功告成。


以下是完整可以运行的代码，可以复制下来跑一下：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> 
 
 
 
 
 
 
 
 
 
 
 
我的ExtJS4.2学习之路
 
 
作者：束洋洋 
开始日期：2013年11月20日 23:20:43 
深入浅出ExtJS之基于表格的右键菜单
 
 
 

连载中，请大家持续关注，本文出自我的个人网站思考者日记网