shoppingcart基础页面
2017-08-24 07:36
204 查看
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<link rel="stylesheet" href="css/bootstrap.css" />
<script type="text/javascript"
src="${pageContext.request.contextPath}/js/jquery-1.8.3.js"></script>
<script type="application/javascript"
src="${pageContext.request.contextPath}/js/angularjs.js"></script>
<script>
/*控制区 */
angular.module('myapp', [])
.controller(
'controller',
function($scope, $http) {
$http.get("${pageContext.request.contextPath}/shop/all")
.success(function(a) {
$scope.cart = a;
});
/* 减按钮 */
$scope.reduce=function(index)
{
$scope.cart[index].count= $scope.cart[index].count-1;
var ssid= $scope.cart[index].ssid;
var count= $scope.cart[index].count;
$.post("${pageContext.request.contextPath}/shop/update",{"ssid":ssid,"count":count});
};
/* 加按钮 */
$scope.add=function(index)
{
$scope.cart[index].count= $scope.cart[index].count+1;
var ssid= $scope.cart[index].ssid;
var count= $scope.cart[index].count;
$.post("${pageContext.request.contextPath}/shop/update",{"ssid":ssid,"count":count});
}
/* 全选按钮 */
$("#all").click(function(){
$("input[type='checkbox']:gt(0)").prop("checked",$(this).prop("checked"));
})
var array=new Array();
/* 批量删除 */
$("#delete").click(function(){
$("input[type='checkbox']:gt(0):checked").each(function(){
array.push($(this).val());
});
$.post("${pageContext.request.contextPath}/shop/delete?array="+array+"",function(a)
{
location.reload();
});
});
});
</script>
</head>
<body ng-app="myapp">
<div class="row" ng-controller="controller">
<div class="col-md-1 col-md-offset-9">
<button class="btn btn-danger" id="delete">批量删除</button>
</div>
<div class="col-md-7 col-md-offset-3">
<table class="table nth-child table-bordered table-hover table-condensed">
<thead>
<tr>
<td><input type="checkbox" id="all"></td>
<td>用户名</td>
<td>商品名</td>
<td>单价</td>
<td>数量</td>
<td>小计</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="x in cart">
<td><input type="checkbox" value="{{x.ssid}}"></td>
<td>{{x.tuser.uname}}</td>
<td>{{x.tproduct.name}}</td>
<td>{{x.tproduct.price | number:2 | currency:"￥ "}}</td>
<td>
<button ng-click="reduce($index)">-</button>
<input value="{{x.count}}" style="width: 30px">
<button ng-click="add($index)" >+</button>
</td>
<td>{{x.tproduct.price *x.count | number:2 | currency:"￥ " }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<link rel="stylesheet" href="css/bootstrap.css" />
<script type="text/javascript"
src="${pageContext.request.contextPath}/js/jquery-1.8.3.js"></script>
<script type="application/javascript"
src="${pageContext.request.contextPath}/js/angularjs.js"></script>
<script>
/*控制区 */
angular.module('myapp', [])
.controller(
'controller',
function($scope, $http) {
$http.get("${pageContext.request.contextPath}/shop/all")
.success(function(a) {
$scope.cart = a;
});
/* 减按钮 */
$scope.reduce=function(index)
{
$scope.cart[index].count= $scope.cart[index].count-1;
var ssid= $scope.cart[index].ssid;
var count= $scope.cart[index].count;
$.post("${pageContext.request.contextPath}/shop/update",{"ssid":ssid,"count":count});
};
/* 加按钮 */
$scope.add=function(index)
{
$scope.cart[index].count= $scope.cart[index].count+1;
var ssid= $scope.cart[index].ssid;
var count= $scope.cart[index].count;
$.post("${pageContext.request.contextPath}/shop/update",{"ssid":ssid,"count":count});
}
/* 全选按钮 */
$("#all").click(function(){
$("input[type='checkbox']:gt(0)").prop("checked",$(this).prop("checked"));
})
var array=new Array();
/* 批量删除 */
$("#delete").click(function(){
$("input[type='checkbox']:gt(0):checked").each(function(){
array.push($(this).val());
});
$.post("${pageContext.request.contextPath}/shop/delete?array="+array+"",function(a)
{
location.reload();
});
});
});
</script>
</head>
<body ng-app="myapp">
<div class="row" ng-controller="controller">
<div class="col-md-1 col-md-offset-9">
<button class="btn btn-danger" id="delete">批量删除</button>
</div>
<div class="col-md-7 col-md-offset-3">
<table class="table nth-child table-bordered table-hover table-condensed">
<thead>
<tr>
<td><input type="checkbox" id="all"></td>
<td>用户名</td>
<td>商品名</td>
<td>单价</td>
<td>数量</td>
<td>小计</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="x in cart">
<td><input type="checkbox" value="{{x.ssid}}"></td>
<td>{{x.tuser.uname}}</td>
<td>{{x.tproduct.name}}</td>
<td>{{x.tproduct.price | number:2 | currency:"￥ "}}</td>
<td>
<button ng-click="reduce($index)">-</button>
<input value="{{x.count}}" style="width: 30px">
<button ng-click="add($index)" >+</button>
</td>
<td>{{x.tproduct.price *x.count | number:2 | currency:"￥ " }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 购物清单页面的处理shoppingCart.aspx and shoppingCart.aspx.cs
- Duwamish7中ShoppingCart页面的错误。
- Magento——利用购物车促销规则（Shopping Cart Price Rules）实现自己的功能第二章： 购物车页面判断设置的规则和动作
- css页面布局基础
- jQuery基础学习5——JavaScript方法获取页面中的元素
- IOS 疯狂基础之 页面间跳转
- 页面某些特定图标的权限，比如导入导出表格，下载等等，这个权限必须在有某个页面查看的权利的基础上（细粒度）（shiro项目中来的四）
- salesforce 零基础学习（六十四）页面初始化时实现DML操作
- IOS页面自动布局之NSLaboutConstraint基础
- 页面动态化的基础 —— Tangram
- DirectX 3D_基础之表面 多重采样 内存池 交互链 页面置换 深度缓存
- javascript 基础--页面最大化
- 运维基础——Zabbix 添加web页面url状态监控
- Bootstrap <基础二十三>页面标题（Page Header）
- Wordpress基础：文章和页面的区别
- 简单的asp.net模拟邮箱系统基础实现（二 （2）具体版块功能的实现及关键代码之登陆页面）
- js基础:js页面刷新问题
- 05-页面转发(jsp基础应用)
- 8个最佳开源购物系统Shopping Cart
- yii2 学习历程——搭建平台基础页面