右击表格弹出编辑、删除框

2024-08-26 13:38
文章标签 表格 删除 编辑 右击

本文主要是介绍右击表格弹出编辑、删除框,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前言

  

    之前ITOO验收的时候,米老师看到考评系统上用到了右击表格弹出编辑、删除框的效果,要求所有系统都要实现。本想着之前留下有文档,应该会比较容易实现,可是文档里的看着就好费劲,实现起来就更难了。所以想着用一个比较简便的方法实现这个效果,后面听到李卫中用了一个比较简单的方法实现这个效果,看了一下他写的博客,其实我还有些不懂,把他叫过来给我讲讲。看到他调代码的过程,对于这个方法的实现才有些明白,但是后面在实现编辑功能的时候,只能弹出一个编辑框,而编辑框里应该加载有选择行的内容,可是我的代码能力太弱了,但是也没有想着自己去百度,就叫来我的小伙伴王朋波来给我调试,半个小时下来,总算是把编辑框弄好了,但是效果还是有些瑕疵。觉得还可以再完善完善,但是不能再叫他来帮我完善。直到敲手机端的时候遇到了同一个问题,才有了解决办法,到后面也算是达到了自己想要的效果了。


实现步骤


1、编写右击触发事件的js文件

      

      注意:“#Family”是表格名称,编写的时候需要改成和自己系统里的表格名称一致的命名。


<span style="font-size:18px;"><script type="text/javascript">$("#Family").datagrid({onRowContextMenu: function (e, rowIndex, rowData) { //右键时触发事件  //三个参数:e应该是对当前菜单的实例化,以便调用;rowIndex就是当前点击时所在行的索引;rowData当前行的数据  e.preventDefault(); //阻止浏览器捕获右键事件  $(this).datagrid("clearSelections"); //取消所有选中项  $(this).datagrid("selectRow", rowIndex); //根据索引选中该行  $('#mm').menu('show', {//显示右键菜单  left: e.pageX,//在鼠标点击处显示菜单  top: e.pageY});var test = document.getElementById("index");test.value = rowIndex;e.preventDefault();  //阻止浏览器自带的右

这篇关于右击表格弹出编辑、删除框的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1108718

相关文章

MyBatis-Plus逻辑删除实现过程

《MyBatis-Plus逻辑删除实现过程》本文介绍了MyBatis-Plus如何实现逻辑删除功能,包括自动填充字段、配置与实现步骤、常见应用场景,并展示了如何使用remove方法进行逻辑删除,逻辑删... 目录1. 逻辑删除的必要性编程1.1 逻辑删除的定义1.2 逻辑删php除的优点1.3 适用场景2.

pandas使用apply函数给表格同时添加多列

《pandas使用apply函数给表格同时添加多列》本文介绍了利用Pandas的apply函数在DataFrame中同时添加多列,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习... 目录一、Pandas使用apply函数给表格同时添加多列二、应用示例一、Pandas使用apply函

C#实现插入与删除Word文档目录的完整指南

《C#实现插入与删除Word文档目录的完整指南》在日常的办公自动化或文档处理场景中,Word文档的目录扮演着至关重要的角色,本文将深入探讨如何利用强大的第三方库Spire.Docfor.NET,在C#... 目录Spire.Doc for .NET 库:Word 文档处理利器自动化生成:C# 插入 Word

MySQL中的DELETE删除数据及注意事项

《MySQL中的DELETE删除数据及注意事项》MySQL的DELETE语句是数据库操作中不可或缺的一部分,通过合理使用索引、批量删除、避免全表删除、使用TRUNCATE、使用ORDERBY和LIMI... 目录1. 基本语法单表删除2. 高级用法使用子查询删除删除多表3. 性能优化策略使用索引批量删除避免

使用Python实现在PDF中添加、导入、复制、移动与删除页面

《使用Python实现在PDF中添加、导入、复制、移动与删除页面》在日常办公和自动化任务中,我们经常需要对PDF文件进行页面级的编辑,使用Python,你可以轻松实现这些操作,而无需依赖AdobeAc... 目录1. 向 PDF 添加空白页2. 从另一个 PDF 导入页面3. 删除 PDF 中的页面4. 在

Java轻松实现在Excel中插入、提取或删除文本框

《Java轻松实现在Excel中插入、提取或删除文本框》在日常的Java开发中,我们经常需要与Excel文件打交道,当涉及到Excel中的文本框时,许多开发者可能会感到棘手,下面我们就来看看如何使用J... 目录Java操作Excel文本框的实战指南1. 插入Excel文本框2. 提取Excel文本框内容3

关于MySQL将表中数据删除后多久空间会被释放出来

《关于MySQL将表中数据删除后多久空间会被释放出来》MySQL删除数据后,空间不会立即释放给操作系统,而是会被标记为“可重用”,以供未来插入新数据时使用,只有满足特定条件时,空间才可能真正返还给操作... 目录一、mysql数据删除与空间管理1.1 理解MySQL数据删除原理1.3 执行SQL1.3 使用

Qt实现删除布局与布局切换功能

《Qt实现删除布局与布局切换功能》在Qt应用开发中,动态管理布局是一个常见需求,比如根据用户操作动态删除某个布局,或在不同布局间进行切换,本文将详细介绍如何实现这些功能,并通过完整示例展示具体操作,需... 目录一、Qt动态删除布局1. 布局删除的注意事项2. 动态删除布局的实现步骤示例:删除vboxLay

Redis中删除策略的几种实现方式

《Redis中删除策略的几种实现方式》本文详细介绍了Redis的过期键删除策略和内存淘汰策略,过期键删除策略包括定时删除、惰性删除和定期删除,具有一定的参考价值,感兴趣的可以了解一下... 目录前言一、设计背景:为什么需要删除策略?二、第一类:过期键的 3 种核心删除策略1. 定时删除(Timed Dele

Linux命令rm如何删除名字以“-”开头的文件

《Linux命令rm如何删除名字以“-”开头的文件》Linux中,命令的解析机制非常灵活,它会根据命令的开头字符来判断是否需要执行命令选项,对于文件操作命令(如rm、ls等),系统默认会将命令开头的某... 目录先搞懂:为啥“-”开头的文件删不掉?两种超简单的删除方法(小白也能学会)方法1:用“--”分隔命