qisan__lianxi2查询排序全选删除批量删除

来源：互联网发布：网络统考报名修改密码编辑：程序博客网时间：2024/05/29 02:55

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title></title>

<script src="js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
* {
margin: 0 auto;
padding: 0;
}
</style>
</head>

<body ng-app="myApp" ng-controller="ctrl">
查询 <input type="text" ng-model="name" /> 排序 <select ng-model="paixu" ng-change="chang()">
<option>按年龄排序</option>
<option>按年龄反序</option>
</select>
<table border="1px">
<tr>
<th ng-click="quanxuan()">选项</th>
<th>姓名</th>
<th>年龄</th>
<th>拼音</th>
<th>职位</th>
<th>操作</th>
</tr>
<tr ng-repeat="x in persons">
<td><input type="checkbox" id="idd" /></td>
<td>{{x.name}}</td>
<td>{{x.age}}</td>
<td>{{x.pinyin}}</td>
<td>{{x.zhiwei}}</td>
<td><a href="#" ng-click="dele($index)">删除</a></td>
</tr>

</table>
<input type="button" value="查询" ng-click="sel()" />
<input type="button" value="添加数据" ng-click="show()" />
<input type="button" value="反选" ng-click="fan()" />
<input type="button" value="批量删除" ng-click="ps()" />

<form id="f">
<fieldset id="">
<legend>添加用户信息</legend>
姓名:<input type="text" name="name1" id="name1" /><br> 年龄:
<input type="text" name="age" id="age" /><br> 拼音:
<input type="text" name="pinyin" id="pinyin" /><br> 职位:
<input type="text" name="zhiwei" id="zhiwei" /><br>
<input type="button" value="保存" ng-click="add()" />
</fieldset>

</form>
<script type="text/javascript">
angular.module("myApp", []).controller("ctrl", function($scope) {
$("#f").hide();
//初始化数据
$scope.persons = [{
"name": "张三",
"age": 20,
"pinyin": "zhangsan",
"zhiwei": "总经理"
}, {
"name": "李四",
"age": 25,
"pinyin": "lisi",
"zhiwei": "副经理"
}, {
"name": "王四",
"age": 22,
"pinyin": "wangwu",
"zhiwei": "工程师"
}];
//显示
$scope.show = function() {
$("#f").show(1000);
}
//查询
$scope.sel = function() {
var name = $scope.name;

if (name == "" || name == null) {
alert("查询框不能为空");
return;
}
if (name.indexOf("奥巴马") != -1) {
alert("有敏感词");
$scope.name = "";
return;
}
var newPerson = [];
for (var i = 0; i < $scope.persons.length; i++) {
var person = $scope.persons[i];
if (person.name.indexOf(name) != -1) {
newPerson.push($scope.persons[i]);
}
}
$scope.persons = newPerson;
}
//排序
$scope.chang = function() {
var name = $scope.paixu;
// alert(name);
if (name == "按年龄排序") {
$scope.persons.sort(function(a, b) {
if (a.age > b.age) {
return 1;
} else {
return -1;
}
});
}

if (name == "按年龄反序") {
$scope.persons.sort(function(a, b) {
if (a.age > b.age) {
return -1;
} else {
return 1;
}
});
}
}
//添加
var i = 1;
$scope.add = function() {

var age = $("#age").val();

if (!isNaN(age)) {
var newPerson = {
"name": "王四" + i++,
"age": age,
"pinyin": "wangwu" + i++,
"zhiwei": "工程师" + i++
};

$scope.persons.push(newPerson);
} else {
alert("年龄格式有误");
}

}

$scope.dele = function(xb) {
var bo = confirm("是否删除");
if (bo) {
$scope.persons.splice(xb, 1);
}

}
var fla = false;
$scope.quanxuan = function() {
var xuan = $("input[type='checkbox']");
if (!fla) {
for (var i = 0; i < xuan.length; i++) {
xuan[i].checked = true;
}
fla = true;
return;
}
if (fla) {
for (var i = 0; i < xuan.length; i++) {
xuan[i].checked = false;
}
fla = false;
}
}

$scope.fan = function() {
var dxs = $("input[id='idd']");

for (var i = 0; i < dxs.length; i++) {
var ison = dxs[i].checked;
// ison.checked=!ison;

alert(ison);
dxs[i].checked = !ison;
}

}

var aa = 0;
$scope.ps = function() {
var str = str1 = 1;
str = "让你的努力配得上你的梦想";
alert("hello word".lastIndexOf("d"));

var dxs = $("input[id='idd']");
for (var i = 0; i < dxs.length; i++) {
var ison = dxs[i].checked;
if (ison) {
// alert(i);
// aa++;
}
}
}
});
</script>
</body>

</html>

阅读全文

0 0