程序博客网 > linux 查找文件命令

angularjs技术实现购物车加减页面，订单页面

来源：互联网发布：linux 查找文件命令编辑：程序博客网时间：2024/05/29 18:07

购物车页面

<script type="text/javascript" src="${pageContext.request.contextPath}/js/angularjs.js"></script>

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/fuxuan.js"></script>
<script type="text/javascript">
   var app=angular.module("myApp", []);

   app.controller("myController",function($scope,$http){

       $http.post("${pageContext.request.contextPath}/goods/select")
       .success(function(obj){
           $scope.shang=obj;
           });
       $scope.jian=function(index){
           var id= $scope.shang[index].id;
           $http.post("${pageContext.request.contextPath}/goods/jian?id="+id)
           .success(function(da){
               --$scope.shang[index].account;
           });

       };
       $scope.jia=function(index){
           var id= $scope.shang[index].id;
           $http.post("${pageContext.request.contextPath}/goods/jia?id="+id)
           .success(function(da){
               ++$scope.shang[index].account;
           });

       };
       //定义一个监听事件
       $scope.$watch("shang",function(newValue,oldValue){
           angular.forEach($scope.shang,function(obj,index){
               //判定当前对象的数量是否小于1
               if(obj.account<1)
               {
                   //判定是否删除
                   if(confirm("是否确认删除？"))
                   {
                       //请求删除的方法
                       $http.post("${pageContext.request.contextPath}/goods/delete?id="+obj.id)
                       .success(function(da){

                               $scope.shang.splice(index,1);
                               alert("删除成功!");
                               location.reload();
                       });
                   }
                   else
                   {
                       //请求添加数量的方法
                       $http.post("${pageContext.request.contextPath}/goods/jia?id="+obj.id)
                       .success(function(da){
                           $scope.shang[index].account=oldValue[index].account;
                       });
                   }

               }
           });
       },true);

       //定义输入框绑定事件
       $scope.change=function(index){

           //获取当前行的ID
           var id= $scope.shang[index].id;

           //获取当前行的数量
           var count=$scope.shang[index].account;

           //请求
           $http.post("${pageContext.request.contextPath}/goods/updateCount?id="+id+"&count="+count)
           .success(function(da){
               location.reload();
           });

       };

       //定义删除方法
       $scope.delete1=function(index){
           var id= $scope.shang[index].id;
           if(confirm("确定要删除吗？"))
           {
               //请求删除的方法
               $http.post("${pageContext.request.contextPath}/goods/delete?id="+id)
               .success(function(da){
                   alert("删除成功!");
                   location.reload();
               });
           }
           else
           {

           }

       };
   });
</script>
</head>

<body ng-app="myApp">
   <div class="container" ng-controller="myController">
       <div class="page-header">
           <h1>购物车页面</h1>
       </div>
       <h4>欢迎${user.username}</h4>
       <table class="table table-striped table-bordered table-hover table-condensed">
           <thead>
               <tr>
                   <td><input type="checkbox" ng-model="all"></td>
                   <td>商品序号</td>
                   <td>商品名称</td>
                   <td>商品价格</td>
                   <td>商品数量</td>
                   <td>商品小计</td>
                   <td>操作</td>
               </tr>
           </thead>
           <tbody>
               <tr ng-repeat="y in shang">
                   <td><input type="checkbox" value="{{y.id}}" ng-checked="all" class="cheid"></td>
                   <td>{{y.id}}</td>
                   <td>{{y.goodsname}}</td>
                   <td>{{y.price | number:2}}</td>
                   <td>
                       <button class=" btn btn-success" ng-click="jian($index)" style="width: 30">-</button>
                       <input type="text" ng-model="y.account" value="{{y.account}}" ng-blur="change($index)" style="width: 30">
                       <button class=" btn btn-success" ng-click="jia($index)" style="width: 30">+</button>
                   </td>
                   <td>{{y.price*y.account}}</td>
                   <td><button class="btn btn-danger" ng-click="delete1($index)">删除</button></td>
               </tr>
           </tbody>
           <tfoot>
               <tr>
                   <button class="btn btn-info" id="buuuid">添加到订单表</button>
                   <a class="btn btn-danger" href="${pageContext.request.contextPath}/order/select">查看订单表</a>
               </tr>

           </tfoot>
       </table>
   </div>

</body>

复选js

$(function(){

   //定义普通按钮点击事件
   $("#buuuid").click(function(){
       //定义数组
       var arr=[];
       //定义获取所有被选中的复选框
       $("input:checked:gt(0)").each(function(obj,index){
           arr.push($(this).val());
       });

       //判定长度
       if(arr.length<0)
       {
           alert("请至少选中一条!");
           return false;
       }
       else
       {
           alert(121);
           $.post("http://127.0.0.1:8080/lianxiti/order/add",{"goods_ids":arr.join(",")},function(da){

               //判定
               if(da=="ok")
               {
                   alert("添加成功!");
                   location.reload();
               }

           },"json");
       }
   });
});

订单页面

<body>
    <table class="table table-striped table-bordered table-hover table-condensed">
       <thead>
           <tr>
               <td>订单号</td>
               <td>用户</td>
               <td>商品名称</td>
               <td>商品数量</td>
               <td>商品小计</td>
           </tr>
       </thead>
       <tbody>
           <c:forEach items="${list}" var="li">
               <tr>
                   <td>${li.id}</td>
                   <td>${li.user_id.username}</td>
                   <td>${li.goods_id.goodsname}</td>
                   <td>${li.goods_id.account}</td>
                   <td>${li.goods_id.price*li.goods_id.account}</td>
               </tr>
           </c:forEach>
       </tbody>
    </table>
</body>

阅读全文

0 0

linux 查找文件命令

linux 查找文件命令

原创粉丝点击

热门问题 老师的惩罚人脸识别我在镇武司摸鱼那些年重生之率土为王我在大康的咸鱼生活盘龙之生命进化天生仙种凡人之先天五行春回大明朝姑娘不必设防，我是瞎子战少深度宠妻免费阅读战少宠妻无节制战少强势宠妻免费阅读亡妻之战总裁宠妻如命战廷深战妻零度战姬重装战姬战姬天下战姬绝唱重装战姬吧复仇战姬战姬机动战姬竞技场战姬战姬绝唱xv 三千战姬斗技场战姬武萌战姬幻想战姬战姬无双战姬三国 0度战姬战姬绝唱3 战姬绝唱4 战姬绝唱8 战姬绝唱吧战姬绝唱05 战姬收藏绝唱战姬零度战姬第二季重装战姬wiki 战姬绝唱第五季零度战姬第一季零度战姬第1季在线播放我的氪金战姬斗技场战姬全集高清在线播放斗技场的战姬零度战姬在线播放重装战姬阵容战姬绝唱第四季