关于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% ...
随机推荐
- 用kotlin方式打开《第一行代码:Android》之开发酷欧天气(1)
参考:<第一行代码:Android>第2版--郭霖 注1:本文为原创,例子可参考郭前辈著作:<第一行代码:Android>第2版 注2:本文不赘述android开发的基本理论, ...
- web 直播&即时聊天------阿里云、融云(二)
上一篇简要主要介绍了融云制作聊天室的基本方法,这次基本属于对上一篇的补充以及进阶...^_^... (ps:吐槽一下,加了三个融云的线下qq群,全部没人解决问题,也不知道建此群的意义,若是民间的话就当 ...
- 模仿qq空间或朋友圈发布动态、评论动态、回复评论、删除动态或评论的功能(上)
我们大部分人都发过动态,想必都知道发动态.回复评论.删除动态的整个过程,那么作为初学者,要模仿这些功能有点复杂的,最起码表的关系得弄清楚~~ 先把思路理一下: (1)用户登录,用session读取 ...
- 项目管理之 Git 管理软件 SourceTree for Mac
Git 项目管理: Mac Terminal 生成 Git 秘钥流程: git config --global user.name "yourname" git config -- ...
- AbstractHandlerMapping解读
一.AbstractHandlerMapping简介 AbstractHandlerMapping是HandlerMapping的抽象实现,所有的HandlerMapping都继承自AbstractH ...
- 安装配置rsync服务端
rsync是类unix系统下的数据镜像备份工具——remote sync.一款快速增量备份工具 Remote Sync,远程同步 支持本地复制,或者与其他SSH.rsync主机同步. rsync使用方 ...
- 腾讯AlloyTeam正式发布omi-cli脚手架 v1.0 - 创建网站无需任何配置
omi-cli omi-cli omi-cli命令 omi框架 用户指南 文件目录 npm 脚本 npm start npm run dist 代码分割 兼容 IE8 插入 CSS 插入组件局部 CS ...
- 关于ASP.NET WebForm与ASP.NET MVC的比较
WebForm的理解 1. WebForm概念 ASP.NETWebform提供了一个类似于Winform的事件响应GUI模型(event-drivenGUI),隐藏了HTTP.HTML.Java ...
- NodeJs的简单介绍
Nodejs是由谷歌v8运行.c++编写的js运行的环境,这里需要记住的是Nodejs只是一个环境. 目前很多主流网站都是使用nodejs,如知乎等大型的网站. 我们关于nodejs学习目标:安装N ...
- 工程师倾情奉献-Win7 ISO 精简操作说明
1.前提条件 a)本文档内容只适用于32bit win7 install ISO,其它OS不能保证兼容 b)示范文件为win7-ultimate-rtm-32-en-us-rdvd.iso 2.准备待 ...