如何实现增删改查二

最新推荐文章于 2022-11-18 14:17:39 发布

不大二叔叔

最新推荐文章于 2022-11-18 14:17:39 发布

阅读量276

点赞数

本文链接：https://blog.csdn.net/qq_41946491/article/details/79812867

版权

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="../js/angular.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var app=angular.module("myApp",[]);
			
			app.controller("myCtr",function ($scope,$http) {
				
				$scope.arr=["--按要求排序--","电影时长正序","电影时长倒序","售价正序","售价倒序","上映时间正序","上映时间倒序"];
				
				/*获取数据*/
				$http.get("moni1.json").then(function (success) {
					$scope.info=success.data;
				})
				
				/*全选全不选*/
				$scope.qx=function () {
					for (var i = 0; i < $scope.info.length; i++) {
						$scope.info[i].check=$scope.iscks;
					}
				}
				
				/*模糊查询*/
				$scope.sou=function () {
					$scope.str2=$scope.str1;
				}
				
				/*批量删除*/
				$scope.delAll=function () {
					for (var i = 0; i < $scope.info.length; i++) {
						if ($scope.info[i].check) {
							$scope.info.splice(i,1);
							i--;
						} else{
							alert("请选择您要删除的数据");
							break;
						}
					}
					$scope.iscks=false;
				}
				
				/*排序*/
				$scope.change=function () {
					/*首先获取需要排序的字段*/
					var value=$scope.selectValue;
					switch (value){
						case "电影时长正序":
						$scope.info.sort(function (a,b) {
							return a.time-b.time;
						})
							break;
						case "电影时长倒序":
						$scope.info.sort(function (a,b) {
							return b.time-a.time;
						})
							break;
						case "售价正序":
						$scope.info.sort(function (a,b) {
							return a.price-b.price;
						})
							break;
						case "售价倒序":
						$scope.info.sort(function (a,b) {
							return b.price-a.price;
						})
							break;
						case "上映时间正序":
						$scope.info.sort(function (a,b) {
							return a.playTime-b.playTime;
						})
							break;
						case "上映时间倒序":
						$scope.info.sort(function (a,b) {
							return b.playTime-a.playTime;
						})
							break;		
						default:
							break;
					}
				}
				
				/*删除*/
				$scope.del=function (index) {
					if (confirm("你确定要删除吗？")) {
						$scope.info.splice(index,1);
						alert("删除成功");
					}
				}
				
				/*修改*/
				$scope.upd=function (index) {
					var a=prompt("修改评分",$scope.info[index].score);
					$scope.info[index].score=a;
				}
				
				
			})
			
			
			
		</script>
	</head>
	
	<body ng-app="myApp" ng-controller="myCtr">
		<input type="text" placeholder="按电影名称模糊查询" ng-model="str1" style="border-radius: 6px;" />
		<button ng-click="sou()">搜索</button>
		<select ng-model="selectValue" ng-options="s for s in arr" ng-init="selectValue=arr[0]" ng-change="change()">{{s}}</select>
		<button ng-click="delAll()">批量删除</button>
		<table border="1" cellspacing="0" cellpadding="0" width="60%">
			<tr>
				<td>
					<input type="checkbox" ng-click="qx()" ng-model="iscks" />
				</td>
				<td>电影名称</td>
				<td>类别</td>
				<td>时长</td>
				<td>导演</td>
				<td>售价</td>
				<td>上映时间</td>
				<td>评分</td>
				<td>操作</td>
			</tr>
			<tr ng-repeat="s in info|filter:{'name':str2}">
				<td>
					<input type="checkbox" ng-model="s.check" />
				</td>
				<td>{{s.name}}</td>
				<td>{{s.type}}</td>
				<td>{{s.time}}分钟</td>
				<td>{{s.author}}</td>
				<td>{{s.price|currency:"￥："}}</td>
				<td>{{s.playTime|date:"yyyy-MM-dd hh:mm:ss"}}</td>
				<td>{{s.score}}</td>
				<td>
					<button ng-click="upd($index)">修改</button>
					<button ng-click="del($index)">删除</button>
				</td>
			</tr>
		</table>
	
	</body>
</html>

不大二叔叔

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
如何实现增删改查二

&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;script src="../js/angular.min.js" type="text/javascript" c
复制链接

扫一扫