1. 程式人生 > >Angular JS 增刪改查(彈框修改)

Angular JS 增刪改查(彈框修改)









input{
border-radius: 5px;
}
ul{
list-style: none;
}
.tip{
color: red;
}
.aquamarine{
background-color: aquamarine;
}
.antiquewhite{
background-color: antiquewhite;
}





–按要求排序–
上映時間正序
上映時間倒序
售價正序
售價倒序




  • 電影名稱:


  • 售價:


  • 類別:


  • 導演:


  • 評分:


  • 上映時間:


  • 時長:


























電影名稱 類別 時長 導演 售價 上映時間 評分 操作
{{m.name}} {{m.type}} {{m.time}} {{m.author}} {{m.price|currency:”¥:”}} {{m.playTime|date:”yyyy-MM-dd HH:mm:ss”}} {{m.score}}


    <!--<ul ng-show="showUpdate">
        <li>請輸入要修改的票價:</li>
        <li><input type="text" ng-model="mprice"/></li>
        <li>
            <input type="button" value="ok" ng-click="update()"/>
            <input type="button" value="cancel" ng-click=""/>
        </li>
    </ul>-->


    <script type="text/javascript">

        function checkAll(){
            var cbs=$("td [type=checkbox]");
            cbs.each(function(){
                if(this.checked){
                    $(this).prop("checked",false);
                }else{
                    $(this).prop("checked",true);
                }
            })
        }

        var app=angular.module("myapp",[]);
        app.controller("myctrl",function($scope){
            $scope.movies=[{
                "price": 35.9,
                "author": "田羽生",
                "time": 120,
                "type": "喜劇, 愛情",
                "id": 1,
                "name": "前任三",
                "playTime": 1511050949001,
                "score": 9.3
            },
            {
                "price": 45.5,
                "author": "格雷",
                "time": 145,
                "type": "動作,冒險",
                "id": 2,
                "name": "速度與激情8",
                "playTime": 1450000949001,
                "score": 9.5
            },
            {
                "price": 42.5,
                "author": "宋陽",
                "time": 135,
                "type": "喜劇,愛情",
                "id": 3,
                "name": "羞羞的鐵拳",
                "playTime": 1511000949001,
                "score": 8.6
            },
            {
                "price": 38.9,
                "author": "弗拉基米爾",
                "time": 108,
                "type": "冒險,科幻",
                "id": 4,
                "name": "太空救援",
                "playTime": 1516000949001,
                "score": 9.4
            }];

            $scope.add=function(){
                var newmovie={};
                newmovie.name=$scope.aname;
                newmovie.price=$scope.aprice;
                newmovie.type=$scope.atype;
                newmovie.playTime=$scope.aplayTime;
                newmovie.time=$scope.atime;
                newmovie.author=$scope.aauthor;
                newmovie.score=$scope.ascore;
                if(newmovie.name==""||newmovie.name==null||newmovie.name==undefined){
                    $("#name").text("*電影名稱不能為空");
                    return;
                }
                if(newmovie.price==""||newmovie.price==null||newmovie.price==undefined||newmovie.price<=0){
                    $("#price").text("*售價大於0");
                    return;
                }
                if(newmovie.type==""||newmovie.type==null||newmovie.type==undefined){
                    $("#type").text("*型別不能為空");
                    return;
                }
                if(newmovie.author==""||newmovie.author==null||newmovie.author==undefined){
                    $("#author").text("*導演不能為空");
                    return;
                }
                if(newmovie.score==""||newmovie.score==null||newmovie.score==undefined){
                    $("#score").text("*評分不能為空");
                    return;
                }
                if(newmovie.playTime==""||newmovie.playTime==null||newmovie.playTime==undefined){
                    $("#playTime").text("*上映時間不能為空");
                    return;
                }
                if(newmovie.time==""||newmovie.time==null||newmovie.time==undefined){
                    $("#time").text("*時長不能為空");
                    return;
                }

                $scope.movies.push(newmovie);
            }

            $scope.del=function(name){
                if(confirm("您確定要刪除嗎?")){
                    for (var i = 0; i < $scope.movies.length; i++) {
                        if($scope.movies[i].name==name){
                            $scope.movies.splice(i,1);
                            break;
                        }
                    }
                }
            }

            $scope.delAll=function(){
                var cbs=$("td input:checked");
                if(cbs.length==0){
                    alert("請選擇要刪除的資料");
                }else{
                    if(confirm("確定刪除嗎?")){
                        cbs.each(function(){
                            for (var i = 0; i < $scope.movies.length; i++) {
                                if($scope.movies[i].name==$(this).val()){
                                    $scope.movies.splice(i,1);
                                    break;
                                }
                            }
                        })
                    }   
                }
            }

               var modifydata;
           $scope.modify=function(name){
                for(var i = 0; i < $scope.movies.length; i++) {
                    if($scope.movies[i].name == name) {
                        modifydata=$scope.movies[i];
                        break;
                    }
                }

            //彈出提示框
               var data=prompt("請輸入要修改的票價:",modifydata.price);
//             alert(data);
               if(data!=null){
                modifydata.price=data;
               }
           }



        });
    </script>
</body>