商品题(查询+批量删除)

最新推荐文章于 2024-08-29 23:38:23 发布
YHMQ66
最新推荐文章于 2024-08-29 23:38:23 发布
阅读量548
点赞数
分类专栏： H5 文章标签： angularjs
本文链接：https://blog.csdn.net/YHMQ66/article/details/78578470
版权
H5 专栏收录该内容
9 篇文章 0 订阅
订阅专栏
                    <!DOCTYPE html>

                    <html lang="en">

                    <head>

                    <meta charset="UTF-8">

                    <title>Title</title>

                    <script type="text/javascript" src="../Anglert/angular.js" ></script>



                    <script>

                    var myapp=angular.module("myapp",[]);



                    var data=[

                    {

                    done:false,

                    id:"1234",

                    name:"ipad",

                    price:3400,

                    only:10,

                    },

                    {

                    done:false,

                    id:1244,

                    name:"iphone",

                    price:6400,

                    only:5,

                    },

                    {

                    done:false,

                    id:1334,

                    name:"mypad",

                    price:4400,

                    only:20,

                    },

                    {

                    done:false,

                    id:8234,

                    name:"zpad",

                    price:8400,

                    only:130,

                    }

                    ]

                    myapp.controller("myctrl",function ($scope) {

                    $scope.data=data;

                    /*删除信息*/

                    $scope.del=(function (hh) {

                    var con=confirm("确定删除么?");

                    if(con==true){

                    for(var i=0;i<$scope.data.length;i++){

                    if($scope.data[i].name==hh)

                    {

                    $scope.data.splice(i,1);

                    }

                    }

                    }else{



                    }



                    }) ;

                    /*删除选中的*/

                    $scope.delall=function () {

                    var con=confirm("确定删除么?");

                    if(con==true){

                    for(var i=0;i<$scope.data.length;i++)

                    {

                    if($scope.data[i].done==true)

                    {

                    $scope.data.splice(i,1);

                    i--;

                    }

                    }

                    }else{



                    }



                    }

                    /*全选*/

                    $scope.checkAll=function () {

                    for(var i=0;i<$scope.data.length;i++)

                    {

                    if($scope.chec==true)

                    {

                    $scope.data[i].done=true;

                    }

                    else{

                    $scope.data[i].done=false;

                    }

                    }

                    }





                    $scope.shop = function () {

                    $scope.shop.color="red";

                    }



                    });

                    $(function () {

                    $("#a").click(function () {

                    $("#a").css("color","red");

                    $("#aa").css("color","black");

                    $("#a3").css("color","black");

                    $("#a4").css("color","black");

                    $("#a5").css("color","black");

                    });

                    $("#aa").click(function () {

                    $("#a").css("color","black");

                    $("#aa").css("color","red");

                    $("#a3").css("color","black");

                    $("#a4").css("color","black");

                    $("#a5").css("color","black");

                    });

                    $("#a3").click(function () {

                    $("#a").css("color","black");

                    $("#aa").css("color","black");

                    $("#a3").css("color","red");

                    $("#a4").css("color","black");

                    $("#a5").css("color","black");

                    });

                    $("#a4").click(function () {

                    $("#a").css("color","black");

                    $("#aa").css("color","black");

                    $("#a3").css("color","black");

                    $("#a4").css("color","red");

                    $("#a5").css("color","black");

                    });

                    $("#a5").click(function () {

                    $("#a").css("color","black");

                    $("#aa").css("color","black");

                    $("#a3").css("color","black");

                    $("#a4").css("color","black");

                    $("#a5").css("color","red");

                    });

                    });



                    </script>

                    </head>

                    <body ng-app="myapp" ng-controller="myctrl">

                    <div>

                    <h3>商品库存信息管理</h3>

                    <hr>

                    <div style="background-color: #E8FBFF;height: 25px">

                    <input type="text" value="" placeholder="请输入关键字..." ng-model="search">

                    <button type="button" style="margin-left:1270px;color: #c3c3c3;background-color: red"ng-click="delall()">批量删除</button>

                    </div>

                    <div>

                    <table border="1" bordercolor="#c3c3c3" width="500" cellpadding="0" cellspacing="0" style="width:1350px;text-align: center">

                    <thead>

                    <tr>

                    <td ><input type="checkbox"ng-click="checkAll()" ng-model="chec"></td>

                    <td id="a" ng-click="desc=!desc;col='id'" >商品编号</td>

                    <td id="aa" ng-click="desc=!desc;col='name'">商品名称</td>

                    <td id="a3" ng-click="desc=!desc;col='price'">商品价格</td>

                    <td id="a4"ng-click="desc=!desc;col='only'">商品库存</td>

                    <td id="a5"ng-click="desc=!desc;col=''">数据操作</td>

                    </tr>

                    </thead>

                    <tr ng-repeat="item in data|filter:{'name':search}|orderBy:col:desc">

                    <td><input type="checkbox" ng-model="item.done"></td>

                    <td>{{item.id}}</td>

                    <td>{{item.name}}</td>

                    <td>{{item.price|currency:"¥"}}</td>

                    <td>{{item.only}}</td>

                    <td>

                    <button style="color: #E8FBFF;background-color: yellow" ng-click="del(item.name)">删除</button>

                    </td>

                    </tr>



                    </table>

                    </div>

                    </div>



                    </body>

                    </html>