按照勾选 删除表格的行<tr>
需求描述:有一个产品列表,有一个删减按钮,点击删减按钮,按照产品勾选的行,删除产品列表中对应的行数据
代码:
//html代码
<table id="table1">
<tr th:each="prod : ${list}" th:id="${prod.productId}">
<td>
<label class="mt-checkbox mt-checkbox-single mt-checkbox-outline" name="lb">
<input type="checkbox" class="checkboxes" th:value="${prod.productId}" name="ckProdId"/>
</label>
</td>
<td th:text="${prod.productName}">产品名</td>
</tr>
</table> //js代码
$("#toCutProd").click("click", function () {
$("input.checkboxes[name='ckProdId']:checkbox").each(function() {
if ($(this).is(":checked")) {
var s= $(this).val();
$('#table1').DataTable().row('#' + s).remove().draw();
ableMany=true;
}
});
});
//这种删除是操作datatable的dom来删除
//ableMany=true 是允许多行的意思
//js代码
$('table input:checked').parents('tr').remove();//这一行就可以搞定 $("input[name='ck']:checked").parent().parent().remove(); //这一行也可以搞定
总结:点滴积累,不断进步
按照勾选 删除表格的行<tr>的更多相关文章
- sencha gridpanel checkbox 复选框的勾选 以及和单机行冲突
gridpanel显示checkbox: 添加SelectionModel为Checkbox Selection Model { xtype: 'gridpanel', id: 'Grid1', he ...
- ASPxGridView 选中主表一行数据,从表自动选中(勾选)对应的行
一.图解 下图为效果图,点击 [A表]种的某一行,[B表]会有与之相对于一行会被自动选中并且勾选上: 二.Html 代码 <html xmlns="http://www.w3.org/ ...
- js实现动态删除表格的行或者列-------Day57
昨天记录了动态加入表格的一行,当然这个一行是指一行数据,也就是说一行多少列也是加上的,而且第几列的内容都能够加入上,先来回想下它的实现的关键点: 1.var row=table.insertRow() ...
- javascript生成表格增删改查 JavaScript动态改变表格单元格内容 动态生成表格 JS获取表格任意单元格 javascript如何动态删除表格某一行
jsp页面表格布局Html代码 <body onload="show()"> <center> <input type="text" ...
- Jquery 表格操作,记录分页情况下,每一页中被用户勾选的信息
如下图,一个分页列表,用户可以随意勾选一条或多条信息,然后进行某种操作,如“提交”.但是有个问题:如果勾选了一条信息之后,点[下一页],那么上一页 勾选的条目被刷新掉了. 问题:如果用户需要在第1页, ...
- 【JavaScript】checkBox的多选行<tr>信息获取
页面的列表table显示(后台model.addAttribute("page", page);传来page信息,page通过foreach标签迭代展示表格数据): <!-- ...
- JQuery实现表格的全选和反选,以及分页勾选保存(laypage插件分页的使用)
需求: 1.全选与取消全选 2.单个勾选,点击表格单元格中checkbox勾选,也可以在点击行勾选,便与用户操作 3.分页勾选保存 4.固定表头 功能一: 说明:操作全选按钮的同时,遍历每一个tr中的 ...
- JQuery Easyui/TopJUI表格基本的删除功能(删除当前行和多选删除)
需求:数据表格datagrid实现删除当前行和多选删除的功能. html <a href="javascript:void(0)" data-toggle="top ...
- Element UI表格组件技巧:如何简洁实现跨页勾选、跨页统计功能
业务场景 在使用Element UI的Table组件时,常常面对这样的业务需求: 表格数据的每一项都要提供勾选框,当切换分页时,能够记忆所有页面勾选的数据,以实现批量提交不同页面勾选数据的功能.并且, ...
随机推荐
- springboot+freemarker
springboot添加freemarker支持 1.application.properties中添加配置 #freemarker config spring.freemarker.allow-re ...
- 「LibreOJ Round #6」花火
转化思维的好题! 链接:here 大致题意: 有$ n$个数字,你每次可以交换相邻两个,还有一次交换任意两个元素的机会,求最少的交换次数使得这些数字升序排序(原数列两两不同) $ solotion:$ ...
- 剑指Offer题解索引
数组 数组中重复的数字 二维数组中的查找 构建乘积数组 字符串 替换空格 字符流中第一个不重复的字符 表示数值的字符串 递归和循环 斐波那契数列 跳台阶 变态跳台阶 矩形覆盖 链表 从尾到头打印链表 ...
- Leetcode#53.Maximum Subarray(最大子序和)
题目描述 给定一个序列(至少含有 1 个数),从该序列中寻找一个连续的子序列,使得子序列的和最大. 例如,给定序列 [-2,1,-3,4,-1,2,1,-5,4], 连续子序列 [4,-1,2,1] ...
- MySql cmd下的学习笔记 —— 有关修饰器的知识(trigger)
关于触发器的理解: 进行数据库应用软件的开发时,有时我们碰到表的某些数据的改变时,希望同时 引起其他相关数据改变的需求,利用触发器就能满足这样的需求. 触发器能在表中的某些特定数据变化时自动完成某些查 ...
- Hadoop配置文件参数详解
core-site.xml <configuration> <property> <name>hadoop.tmp.dir</name> <val ...
- mysql定时任务用到存储过程和定时任务
需求: 需要将t_app_message中的消息(将要被发送的消息)给每一个学生发送一遍,并且在发送完成后,将消息置为已发送状态已发送状态. 一言不合上代码 /*删除存储过程*/ drop proce ...
- Akka Quickstart with Java-笔记
官方文档: http://developer.lightbend.com/guides/akka-quickstart-java/?_ga=2.177525157.1012573474.1504767 ...
- JiBX笔记
注意事项 JiBX:1.2.2 (https://sourceforge.net/projects/jibx/files/jibx/jibx-1.2.2/) JDK:1.6 (http://www.o ...
- boost::function 介绍
本片文章主要介绍boost::function的用法. boost::function 就是一个函数的包装器(function wrapper),用来定义函数对象. 1. 介绍 Boost.Func ...