关于jquery全选反选 批量删除的一点心得
废话不多说直接上代码:
下面是jsp页面的html代码:
<table id="contentTable" class="">
<thead>
<tr>
<th><input type="checkbox" id="All" value="全选/全不选" />全选/全不选</th>
</tr>
</thead>
<tbody>
<c:forEach items="${page.list}" var="advAdvertisement">
<tr>
<td><input type="checkbox" value="${advAdvertisement.id}" name="checkbox" class="checkbox"/></td>
</tr>
</c:forEach>
</tbody>
</table>
然后是jquery:
$(document).ready(function(){ $('#All').change(function(){ if($('#All').attr('checked')){ $('.checkbox').attr('checked',true); }else{
$('.checkbox').removeAttr('checked');
} });
});
代码简单明了,相信聪明的你一看就懂。
最后是批量删除选中的复选框数据:
<input id="btnSubmit" class="" onclick="deleteAll();" type="button" value="批量删除"/> <script type="text/javascript"> function deleteAll(){
if(confirm('确认要删除选中的广告吗?')==true){ var obj=document.getElementsByName('checkbox'); //选择所有name="'test'"的对象,返回数组
//取到对象数组后,我们来循环检测它是不是被选中
var s=new Array();
for(var i=0; i<obj.length; i++){
if(obj[i].checked){
s[i]=obj[i].value;
} //如果选中,将value添加到数组s中
}
//那么现在来检测s的值就知道选中的复选框的值了
alert(s==''?'你还没有选择任何内容!':s);
alert(s);
$.ajax({
type:'POST',
url:'${ctx}/adv/advAdvertisement/deleteAll',
data:{'ids':s},
traditional:true,
dataType:'text',
success:function(data){alert('删除成功!')}
});
window.location.href="";
}
}
</script>
批量删除的时候需要去获取每一个被选中的复选框的id,我们用一个数组把他们存起来,最重要的一点,是要在$.ajax中配置traditional:true这个属性,如果不配置后台controller是不认可的。
后台接收的话直接用一个String[] ids数组接收就可以得到关于id的一个数组了,然后for循环尽情的做你想做的一切吧!
批量删除的话用 where in 语句比较合适:
<update id="deleteAll" parameterType="java.util.Arrays"> UPDATE test_data SET
del_flag = 1
where id in <foreach item="idItem" collection="array" open="(" separator=","
close=")"> #{idItem} </foreach> </update>
关于jquery全选反选 批量删除的一点心得的更多相关文章
- angularJS 全选反选批量删除
<th> <label for="flag"> <span ng-hide="master">全选</span> ...
- php--jquery操作全选、批量删除、加减行
- jQuery全选/反选checkbox
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 关于JQuery全选/反选第二次失效的问题
最近在项目中,遇到一个问题,测试全选/反选功能时,第一次对母框进行选中/非选中时,能同步子框的全选/反选状态,之后再点击母框,子框就没反应了.原代码大致结构关键如下: function selectA ...
- jQuery全选反选插件
(function($){ $.fn.check = function(options){ var options = $.extend({ element : "input[name='n ...
- jQuery全选反选实例
1. $('#tb:checkbox').each(function(){ 每次都会执行 全选-取消操作,注意$('#tb :checkbox').prop('checked',true); tb后面 ...
- JQuery 全选 反选 获取Table 中指定td的元素值
//全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th>& ...
- jquery全选 反选
//全选 反选 $('#chkAll').on('click',function(){ $('input.chkbox').prop('checked',$(this).prop('checked') ...
- jQuery实现checkbox全选反选及删除等操作
1.list.html 说明:用checkbox数组Check[]存放每一行的ID值 <div id="con"> <table width="100% ...
随机推荐
- VR全景智慧城市-VR大时代
这是一个创业的时代,这是一个创新的社会,我们的国家从没有像今天这样高度重视创业创新,我们的社会从没有像今天这样对创业创新寄予如此厚望.李克强总理在2015年政府工作报告中指出:要把"大众创业 ...
- Linux环境g++编译GDAL动态库
一.编译步骤 解压下载的GDAL源程序,并在命令行中切换到解压目录. tar -xzvf gdal-2.1.3.tar.gz cd gdal-2.1.3 GDAL可通过configure来实现一些自定 ...
- java面向对象--继承与多态
可以为一个变异单元中的每个类创建一个main方法,只有命令行所调用的那个类的main方法才会被调用,这样方便进行单元测试.继承时,一般将所有的数据成员都指定为private,将所有的方法指定为publ ...
- 【转】HTTP长连接与短连接(2)
一.什么是长连接 HTTP1.1规定了默认保持长连接(HTTP persistent connection ,也有翻译为持久连接),数据传输完成了保持TCP连接不断开(不发RST包.不四次握手),等待 ...
- 2017-5-18 Repeater 重复器的使用
Repeater - 重复器HeaderTemplate - 先执行,执行一次FooterTemplate - 最后执行,执行一次ItemTemplate - 在Header之后执行,有多少条数据绑定 ...
- Qt之添加图标
导读: 在使用Qt Creator编写完应用程序后,设置release版的应用程序图标着实困扰了不少的人.一个漂亮的图标是一个软件的脸,没有一个漂亮的图标,那么这个程序是不完整的.那么我们来看看如何设 ...
- laravel中的多对多关系详解
数据表之间是纵横交叉.相互关联的,laravel的一对一,一对多比较好理解,官网介绍滴很详细了,在此我就不赘述啦,重点我记下多对多的关系 一种常见的关联关系是多对多,即表A的某条记录通过中间表C与表B ...
- cpp(第十七章)
1.baseic_ostream<charT,traits>& write(const char_type *s,streamsize n),cout.write()第一个参数提供 ...
- Dojo初探之3:dojo的DOM操作、query操作和domConstruct元素位置操作(基于dojo1.11.2版本)
前言: 前面两章讲了dojo的基本规范和配置,当然这个配置不是必须的,当你有这需求的时候就可以用到dojo的config配置. dojo的所有js都是符合AMD规范进行异步加载的:http://blo ...
- 什么是Web Worker?
简单点说,Web Worker就是一个运行在后台的JavaScript线程,不会影响页面的响应. 我们知道,JavaScript是单线程的脚本语言,即同一时刻只能做一件事情,否则会带来极其复杂的同步问 ...