EasyUI 表格点击右键添加或刷新 绑定右键菜单

例1

在HTML页面中设置一个隐藏的菜单（前提是已经使用封装的Easyui）

代码：

  <div >不通过</div>
</div>

第二步：

编写js代码

  $("#dt").datagrid({

 onRowContextMenu: function (e, rowIndex, rowData) { //右键时触发事件                      
                        e.preventDefault(); //阻止浏览器捕获右键事件
                        $(this).datagrid("clearSelections"); //取消所有选中项
                        $(this).datagrid("selectRow", rowIndex); //根据索引选中该行
                        $('#contextMenu_jygl').menu('show', {                        
                            left: e.pageX,//在鼠标点击处显示菜单
                            top: e.pageY
                        });
                        e.preventDefault();  //阻止浏览器自带的右键菜单弹出
                    },

})

 例2

1. <table id="dg" class="easyui-datagrid"  data-options="onRowContextMenu: function (e, rowIndex, rowData) {       
2.  $('#mm').menu('show', { left: e.pageX, top: e.pageY }); e.preventDefault();  
3. }  
4. <tr>.....</tr>  
5.  <tr>.....</tr>  
6.  <tr>.....</tr>  
7.  <tr>.....</tr>  
8. </table>   

<div >导入</div>   
          </div>   
      </div>   
    </div>

1. 右击表格数据行显示效果图如下：  

 

 

例三

<table ></table>

 

<div >添加</div>

<div >涮新</div>
</div>

刷新

$('#mmCustomerCHis #gridViewRefresh').on("click", function () {
$('#' + tableId).datagrid('reload');
});

添加

$('#mmStorageManager #gridViewAdd').on("click", function () {
datagridAdd();
});

 

function datagridAdd() {
var data = $('#' + tableId).datagrid('getData');
if (data.rows.length < 6) {
dataOption.ListOperation(StorageManager, null, 2, "", "/StorageManager/BaseStorageManagerOption", tableId, refreshNode);
}
else {
showTime("最多只能拥有5个仓库!",3);
}
};