过滤查找

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            .y1{
                float: left;
                margin-left: 550px;
                display: none;
                
            }
        </style>
        <script src="js/angular.min.js" ></script>
        <script src="js/jquery-1.11.1.min.js" ></script>
        <script>
            var app=angular.module("mydete",[]);
            app.controller("mydoc",["$scope",function($scope){
                    $scope.dete=[{"key":"false","name":"韦作铭","pas":"99999999","age":15,"sex":"男"},{"key":"false","name":"罗兵","pas":"333333","age":20,"sex":"女"},{"key":"false","name":"王成","pas":"444444","age":30,"sex":"男"}];
                    
                                $scope.aname1=false;
                    
                            for (var i=0; i<$scope.dete.length;i++) {
                                $scope.sum=$scope.dete[i].shuliang*$scope.dete[i].pric+$scope.sum;
                                
                            }
                            $scope.del=function($index)
                            {
                                /*$scope.dete.splice($index,1);*/
                                $scope.dete[$index].pass=$scope.pass1
                                
                            }
                            
                            $scope.add=function()
                            {            $scope.sum=0;
                                    $scope.dete.push({name:$scope.name1,pas:$scope.pas1,age:$scope.age1,sex:$scope.sex1});
                                    for (var i=0; i<$scope.dete.length;i++) {
                                        
                                $scope.sum=$scope.dete[i].shuliang*$scope.dete[i].pric+$scope.sum;
                            }        
                            }
                            $scope.sdd=function()
                            {            
                                
                                
                                $scope.sum=$scope.sum;
                            }        
                            
                            
                            
                            /*删除全部*/
                            $scope.shchu=function(){
                                for (var j=0 ; j<$scope.dete.length+1;j++) {
                                    for (var i=0 ; i<$scope.dete.length;i++) {
                                    $scope.dete.splice(i);
                                }
                                }
                                
                            };
                            
                            
                            
            }]);
            $(function(){
                $("#ss").click(function(){
                    $("#show1").show();
                    
                })
                $("#add").click(function(){
                    $("#show1").hide();
                    
                })
            })
        </script>
    </head>
    
    <body  ng-app="mydete" ng-controller="mydoc">
        
        <form>
        <table align="center" border="1px">
            
                <tr>
                    <td>姓名查找<input type="text" ng-model="names"/></td>
                    <td>年龄查找<input type="text" ng-model="ages"/></td>
                    <td>
                        性别查找
                        <select ng-model="sexs">
                         <option>--请输入查找--</option>
                          <option ng-click="cs1(1)">男</option>
                          <option ng-click="cs2(2)">女</option>
                       </select>
                    </td>
                    <td><a><input type="button" value="删除全部" ng-click="shchu()"/></a><input type="button" value="批量删除"/></td>
                </tr>
            </table>
        </form>    
            <table align="center" style="width: 800px">
            <tbody>
                <tr>
                    <td>全选<input id="qu" type="checkbox"/></td>
                    <td>序号</td>
                    <td>姓名</td>
                    <td>密码</td>
                    <td>年龄</td>
                    <td>性别</td>
                    <td>操作</td>
                </tr>
                <tr  ng-repeat="dut in dete | filter:{name:names,age:ages,sex:sexs}">
                    <td><input type="checkbox"/></td>
                    <td>{{$index}}</td>
                    <td>{{dut.name}}</td>
                    <td>{{dut.pas}}</td>
                    <td>{{dut.age}}</td>
                    <td>{{dut.sex}}</td>
                    <td><button ng-click="del($index)">修改密码</button></td>
                </tr>
            </tbody>
        </table>
        <br />
        </div>
        <script src="http://www.runoob.com/try/demo_source/namesController.js"></script>
        <button id="ss" ng-click="sdd()" style="margin-left: 600px;">添加用户</button>
        
        <div class="y1" align="center" id="show1">
            <table>
                <tr>
                    <td>姓名</td>
                    <td><input type="text" ng-model="name1"/></td>
                </tr>
                <tr>
                    <td>密码</td>
                    <td><input type="text" ng-model="pas1"/></td>
                </tr>
                <tr>
                    <td>年龄</td>
                    <td><input type="text" ng-model="age1"/></td>
                </tr>
                <tr>
                    <td>性别</td>
                    <td><input type="text" ng-model="sex1"/></td>
                </tr>
                <tr>
                    <td colspan="2" align="center"><button id="add" ng-click="add()">提交</button></td>
                    
                </tr>
            </table>
            
        </div>
    </body>
</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值