多选框全选和取消全选

最新推荐文章于 2023-10-19 13:50:01 发布

dijiu8050

最新推荐文章于 2023-10-19 13:50:01 发布

阅读量210

点赞数

文章标签： java javascript 开发工具 ViewUI

原文链接：http://www.cnblogs.com/Xuesk/p/9405315.html

版权

<%--
Created by IntelliJ IDEA.
User: Mr.Xue
Date: 2017/9/17
Time: 13:50
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

//单个删除
function del(dels) {
$.ajax({
type:"post",
url:"${pageContext.request.contextPath }/phone/deleteShopCar.action",//需要用来处理ajax请求的action
data:{//设置数据源
ids:dels
},
dataType:"json",//设置需要返回的数据类型
success:function(data){
var count = data.count;
if(count == 1)
{

alert("删除成功");
$("#tr"+dels).remove();
// $(":checkbox").removeAttr("checked");
// $("#content").val("");
}else{
alert("删除失败");
}
},
error:function(){
alert("系统异常，请稍后重试！");
}
});

};

// 购买
function buy(dels) {
$.ajax({
type:"post",
url:"${pageContext.request.contextPath }/phone/buyPhone.action",//需要用来处理ajax请求的action
data:{//设置数据源
ids:dels
},
dataType:"json",//设置需要返回的数据类型
success:function(data){
var count = data.count;
if(count == 1)
{

alert("购买成功");

// $(":checkbox").removeAttr("checked");
// $("#content").val("");
}
else if(count==2){
alert("余额不足");
}else
{
alert("购买失败");
}
},
error:function(){
alert("系统异常，请稍后重试！");
}
});

};

$(function () {
//批量删除
$("#plsc").click(function () {

var delIds="";
$("input[type=checkbox]:gt(0):checked").each(function() { // 遍历选中的checkbox
delIds+=$(this).val(); // 获取checkbox所在行的顺序
});

$.ajax({
type:"post",
url:"${pageContext.request.contextPath }/phone/deleteShopCarAll.action",//需要用来处理ajax请求的action
data:{//设置数据源
ids:delIds
},
dataType:"json",//设置需要返回的数据类型
success:function(data){
var count = data.count;
if(count == 1)
{

alert("删除成功");
$("input[type=checkbox]:gt(0):checked").each(function() { // 遍历选中的checkbox
$("#tr"+$(this).val()).remove();
});
}
else
{
alert("删除失败");
}
},
error:function(){
alert("系统异常，请稍后重试！");
}
});
});

//全选全不选
$("#che").click(function() {
if($(this).is(":checked")){
$('input[type=checkbox]:gt(0)').attr("checked",true);
}else{
$('input[type=checkbox]:gt(0)').attr("checked",false);
}

});
});

</script>
</head>
<body>
<center>
<h1>我的购物车</h1>

<%--查询表格--%>
<table border="1">
<tr>
<td><input type="checkbox" id="che"></td>
<td>id</td>
<td>品牌</td>
<td>价格</td>
<td>数量</td>
<td>图片</td>
<td><input type="button" value="批量删除" id="plsc"></td>
</tr>

<c:forEach items="${phones }" var="phone">
<tr id="tr${phone.id}">

<td><input type="checkbox" value="${phone.id}"></td>
<td>${phone.id }</td>
<td>${phone.brank }</td>
<td>${phone.price }</td>
<td>${phone.number }</td>
<td></td>

</tr>

</c:forEach>

</table>
</center>
</body>
</html>

转载于:https://www.cnblogs.com/Xuesk/p/9405315.html

dijiu8050

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
多选框全选和取消全选

<%-- Created by IntelliJ IDEA. User: Mr.Xue Date: 2017/9/17 Time: 13:50 To change this template use File | Settings | File Templates.--%><%@ page contentType="text/html;charset=UTF-...
复制链接

扫一扫