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

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

相关文章

C#使用Spire.XLS快速生成多表格Excel文件

《C#使用Spire.XLS快速生成多表格Excel文件》在日常开发中,我们经常需要将业务数据导出为结构清晰的Excel文件,本文将手把手教你使用Spire.XLS这个强大的.NET组件,只需几行C#... 目录一、Spire.XLS核心优势清单1.1 性能碾压:从3秒到0.5秒的质变1.2 批量操作的优雅

MySQL 数据库表操作完全指南:创建、读取、更新与删除实战

《MySQL数据库表操作完全指南:创建、读取、更新与删除实战》本文系统讲解MySQL表的增删查改(CURD)操作,涵盖创建、更新、查询、删除及插入查询结果,也是贯穿各类项目开发全流程的基础数据交互原... 目录mysql系列前言一、Create(创建)并插入数据1.1 单行数据 + 全列插入1.2 多行数据

mybatisplus的逻辑删除过程

《mybatisplus的逻辑删除过程》:本文主要介绍mybatisplus的逻辑删除过程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录myBATisplus的逻辑删除1、在配置文件中添加逻辑删除的字段2、在实体类上加上@TableLogic3、业务层正常删除即

MybatisPlus中removeById删除数据库未变解决方案

《MybatisPlus中removeById删除数据库未变解决方案》MyBatisPlus中,removeById需实体类标注@TableId注解以识别数据库主键,若字段名不一致,应通过value属... 目录MyBATisPlus中removeBypythonId删除数据库未变removeById(Se

MySQL逻辑删除与唯一索引冲突解决方案

《MySQL逻辑删除与唯一索引冲突解决方案》本文探讨MySQL逻辑删除与唯一索引冲突问题,提出四种解决方案:复合索引+时间戳、修改唯一字段、历史表、业务层校验,推荐方案1和方案3,适用于不同场景,感兴... 目录问题背景问题复现解决方案解决方案1.复合唯一索引 + 时间戳删除字段解决方案2:删除后修改唯一字

使用Python删除Excel中的行列和单元格示例详解

《使用Python删除Excel中的行列和单元格示例详解》在处理Excel数据时,删除不需要的行、列或单元格是一项常见且必要的操作,本文将使用Python脚本实现对Excel表格的高效自动化处理,感兴... 目录开发环境准备使用 python 删除 Excphpel 表格中的行删除特定行删除空白行删除含指定

Linux下删除乱码文件和目录的实现方式

《Linux下删除乱码文件和目录的实现方式》:本文主要介绍Linux下删除乱码文件和目录的实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录linux下删除乱码文件和目录方法1方法2总结Linux下删除乱码文件和目录方法1使用ls -i命令找到文件或目录

Mysql实现范围分区表(新增、删除、重组、查看)

《Mysql实现范围分区表(新增、删除、重组、查看)》MySQL分区表的四种类型(范围、哈希、列表、键值),主要介绍了范围分区的创建、查询、添加、删除及重组织操作,具有一定的参考价值,感兴趣的可以了解... 目录一、mysql分区表分类二、范围分区(Range Partitioning1、新建分区表:2、分

MySQL 删除数据详解(最新整理)

《MySQL删除数据详解(最新整理)》:本文主要介绍MySQL删除数据的相关知识,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录一、前言二、mysql 中的三种删除方式1.DELETE语句✅ 基本语法: 示例:2.TRUNCATE语句✅ 基本语

一文详解Git中分支本地和远程删除的方法

《一文详解Git中分支本地和远程删除的方法》在使用Git进行版本控制的过程中,我们会创建多个分支来进行不同功能的开发,这就容易涉及到如何正确地删除本地分支和远程分支,下面我们就来看看相关的实现方法吧... 目录技术背景实现步骤删除本地分支删除远程www.chinasem.cn分支同步删除信息到其他机器示例步骤