Datagrid添加右键菜单 标签: 三层EasyUI 2015-08-14 19:57 1029人阅读 评论(22)
最近的一个项目前台使用的EasyUI,每个界面都有DataGrid控件,按照我们的想法,应该做出来的效果是单击选中,双击可编辑,当然右键也应该出现这些菜单按钮,想的挺好,那么该如何实现呢?一开始不知道如何下手,查了一些资料,也走了很多弯路,主要是查到代码以后不知道写在哪里。。导致弄了一天也没有做出来,后来换了一个思路,终于完成了。
首先建一个DataGrid的表格,我是在EasyUI官网上的Demo里面找的行编辑的代码来用,效果如下,单击可以进行行编辑,不过这不是咱们需要的主要功能,咱们需要的知识这个DataGrid控件及其数据:
有了数据,咱们就可以添加右键的代码了,代码很简单,放到<body></body>里面就可以,如下:
附上代码:
<span style="font-family:KaiTi_GB2312;font-size:24px;"><div style="margin: 20px 0;" id="mm" class="easyui-menu" data-options="onClick:menuHandler"> <div data-options="name:'add'" onclick="append()">Add</div>
@* <div data-options="name:'edit',iconCls:'icon-save'" onclick="onClickCell(index, field)">Edit</div>*@
<div data-options="name:'save',iconCls:'icon-save'" onclick="accept()">Save</div>
<div data-options="name:'remove',iconCls:'icon-print'" onclick="removeit()">Remove</div>
<div class="menu-sep"></div>
<div data-options="name:'exit'">Exit</div> <script>
function menuHandler(item) {
$('#log').prepend('<p>Click Item: ' + item.name + '</p>');
}
$(function () {
$(document).bind('contextmenu', function (e) {
e.preventDefault();
$('#mm').menu('show', {
left: e.pageX,
top: e.pageY
});
});
});
</script>
</div></span>
加入这段代码以后,就可以做到如下效果:
右键的功能实现以后,如何使右键的添加/删除/修改等功能真正可以使用呢?因为本来就写了这些方法,所以,只要在右键菜单的onclick事件添加这些事件名称就可以了。
很多功能一开始不知道如何下手,但是只要开始做了,总会离自己要的效果越来越接近,去做,才最重要!
Datagrid添加右键菜单 标签: 三层EasyUI 2015-08-14 19:57 1029人阅读 评论(22)的更多相关文章
- [运维]Dell R710 raid配置 标签: raid运维 2017-04-15 19:35 581人阅读 评论(16)
Dell R系列的一些服务器,raid的配置都大同小异,公司大部分的服务器,都是Dell R710型号的,这个型号的raid界面配置起来还是很简单的,下面来跟随小编体验一下raid如何配置吧.ps:图 ...
- EasyUI - DataGrid 去右边空白滚动条列 分类: JavaScript 2014-09-03 10:46 1090人阅读 评论(2) 收藏
熟悉 EasyUI - DataGrid 的童鞋应该会注意到这样一个情景: 想去掉这块,找了下资料,发现也有人同样纠结:http://www.cnblogs.com/hantianwei/p/3440 ...
- JqueryEasyUI 解决IE下datagrid无法刷新的问题 分类: JavaScript JqueryEasyUI 2014-09-20 10:05 510人阅读 评论(1) 收藏
问题描述: 在使用JqueryEasyUI 时,发现在IE下$('#table').datagrid('reload');无效,数据并没有被刷新,究其原因,是因为刷新时,datagrid请求的url没 ...
- 数字图像处理:基于MATLAB的车牌识别项目 标签: 图像处理matlab算法 2017-06-24 09:17 98人阅读 评论(0)
学过了数字图像处理,就进行一个综合性强的小项目来巩固一下知识吧.前阵子编写调试了一套基于MATLAB的车牌识别的项目的代码.今天又重新改进了一下代码,识别的效果好一点了,也精简了一些代码.这里没有使用 ...
- linux 用户切换 标签: linux 2016-07-30 13:57 144人阅读 评论(0) 收藏
一.指令修改 1.普通用户切换到root用户: su root 需要输入密码 2.root用户切换到普通用户: su 用户名 不需要输入密码 二.直接注销,再用新用户登录 注:1.两种方式存在差别,用 ...
- [运维]VMware vSphere介绍 标签: 运维 2017-04-21 19:48 532人阅读 评论(17)
大部分的程序员,应该是使用过vmware workstation的,我们用这款软件来创建虚拟机,满足我们学习或者工作的一些问题,今天介绍的是vmware家的另一款,不算是软件,比软件范围更大,VMwa ...
- [ITOO]动态建库 标签: 库数据库mysql 2016-07-17 21:23 241人阅读 评论(2) 收
最近一直在做权限系统的动态建库,动态建库,说白了就是在你点击"注册"按钮的时候,根据你输入的信息,来创建一个企业所需要的数据库的过程,因为现阶段并没有提供购买等功能,所以暂时咱们是 ...
- C#总结 标签: c# 2014-12-07 19:07 1148人阅读 评论(47) 收藏
之前考二级的时候,C++没有好好的学,如今到了学C#的时候,又重新明白了一遍出来混,迟早要还得道理,我觉得,其实C#比C++简单,应该是因为之前没有好好学得原因,其实现在学C#,也是和一年前一样,照着 ...
- 【uml】之类图中的关系 标签: uml图形类 2014-11-29 09:02 1198人阅读 评论(23)
uml早就画完了图,但是自己迟迟没有总结,因为总觉的自己把握的不到位,虽然现在也还是不到位,废话少说,上篇博客总结了用例图中的几种关系,这篇就讨论一下类图中的几种关系. 在uml的所有图中,就我目前的 ...
随机推荐
- Django项目:CRM(客户关系管理系统)--22--14PerfectCRM实现King_admin分页的省略显示
{#table_data_list.html#} {## ————————08PerfectCRM实现King_admin显示注册表的字段表头————————#} {% extends 'king_m ...
- SSM2-搭建maven常见的错误以及解决方法
1.项目中的jdk版本电脑自带的jdk版本不一致 mavne-parent 的pom.xml文件 <!-- java编译插件 --> <plugin> <groupId& ...
- 完美解决IE8不支持margin auto问题
不用js,超级简单,完美支持. body下的整个container .container { overflow: hidden; margin: 0px auto; text-align: cente ...
- python 3.0读取文件出现编码错误(illegal multibyte sequence )
代码如下: myfile2=open('e:/enterprise.xlsx',mode = 'r') file2_content=myfile2.readlines() print(file2_co ...
- 对BOM的总结
参考:JavaScript半知半解 TG著 BOM对象 Window对象是客户端JavaScript程序的全局对象. Window对象使得JavaScript与浏览器进行交互. 所有的JavaScri ...
- Java review-basic1
1. Dependency Injection Answer: Any application is composed of many objects that collaborate with ea ...
- 使用 prerender 实现 SEO
server { listen 80; server_name www.umount.com; access_log /var/log/nginx/livefrontend/access.log LF ...
- jnhs中国的省市县区邮编坐标mysql数据表
https://blog.csdn.net/sln2432713617/article/details/79412896 -- 1.之前项目中需要全国的省市区数据,在网上找了很多,发现数据要么不全,要 ...
- oracle习题集-高级查询2
1.列出员工表中每个部门的员工数和部门编号 Select deptno,count(*) from emp group by deptno; 2.列出员工表中,员工人数大于3的部门编号和员工人数 ; ...
- 2019-9-2-win10-uwp-保存用户选择文件夹
title author date CreateTime categories win10 uwp 保存用户选择文件夹 lindexi 2019-09-02 12:57:38 +0800 2018-2 ...