按照勾选 删除表格的行<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组件时,常常面对这样的业务需求: 表格数据的每一项都要提供勾选框,当切换分页时,能够记忆所有页面勾选的数据,以实现批量提交不同页面勾选数据的功能.并且, ...
随机推荐
- LOJ #2547 Luogu P4517「JSOI2018」防御网络
好像也没那么难写 LOJ #2547 Luogu P4517 题意 在一棵点仙人掌中等概率选择一个点集 求选出点集的斯坦纳树大小的期望 定义点仙人掌为不存在一个点在多个简单环中的连通图 斯坦纳树为在原 ...
- 【mmall】递归查询子节点并排重
代码 @Override public ServerResponse getSelfAndChildrenCategory(Integer categoryId) { if (categoryId ! ...
- mysql 架构 ~ MGR 与PXC的对比
一 简介 MGR和PXC的对比 二 WriteSet1 定义 是组件对于写节点应用事务生成binlog的再封装,用来验证其他节点的事务冲突 PXC构成key db_table_组件值data bin ...
- keepalived高可用系列~keepalived+mysql
一 简介:建立读写分离模式 二 keepalived相关配置 vrrp_instance VI_1 { state MASTER // 可修改 interface eth0 virtual_r ...
- 个人经验~mongo故障处理思路
一 简介:mongodb 应该如何排查二 分析角度 linux 角度 1 硬件是否有问题 常见主板 raid卡 和raid磁盘组 2 综合指标 负载 uptime : 1min 5mi ...
- Fresco,Glide,Picasso
1.Picasso和Glide的with后面的参数不同 Picasso.with(这里只能传入上下文) . Glide.with,后面可以传入上下文,Application实例,Activit ...
- 20165237 2017-2018-2 《Java程序设计》第2周学习总结
20165237 2017-2018-2 <Java程序设计>第2周学习总结 教材学习内容总结 1.标识符第一个字符不能是数字. 2.标识符不能是关键字,也不能是true.false和nu ...
- 已安装nginx支持https配置 the "ssl" parameter requires ngx_http_ssl_module
原文链接:https://blog.seosiwei.com/detail/28 nginx已安装,ssl模块未安装的解决方法: 如果需要在linux中编译自己的nginx服务器,请参照:https: ...
- Linux C++ TCP Socket传输文件或图片实例
环境:Linux 语言:C++ 通信方式:TCP 下面用TCP协议编写一个简单的服务器.客户端,其中服务器端一直监听本机的6666号端口.如果收到连接请求,将接收请求并接收客户端发来的消息:客户端与服 ...
- 为了确认是您本人在申请搬家,请在原博客发表一 篇标题为《将博客搬至CSDN》的文章,并将文章地址填写在上方的"搬家通知地址"中
为了确认是您本人在申请搬家,请在原博客发表一 篇标题为<将博客搬至CSDN>的文章,并将文章地址填写在上方的"搬家通知地址"中