<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="../../../js/angular/angular.js"></script>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.shops = [{
id: 80,
name: "iPhone",
price: 5400,
num:10,
state: false
}, {
id: 1200,
name: "ipad mini",
price: 2200,
num:20,
state: false
}, {
id: 500,
name: "ipad air",
price: 2340,
num:30,
state: false
}, {
id: 29,
name: "ipad",
price: 1420,
num:40,
state: false
}, {
id: 910,
name: "imac",
price: 6600,
num:50,
state: false
}];
//下拉菜单排序
$scope.orderSel = "";
/*$scope.de=function(index){
//删除当前项
$scope.shops.splice(index,1);
}*/
$scope.de = function(name, state) {
if(state) {
if(window.confirm("确定要删除" + name + "吗？")) {
for(index in $scope.shops) {
if(name == $scope.shops[index].name) {
$scope.shops.splice(index, 1);
}
}
}
}else{
alert("请先选择");
}
}
//修改价格
$scope.update = function(shop){
var newPrice = window.prompt("请输入要修改的"+shop.name+"商品的价格",shop.price);
if(newPrice == null || newPrice == ""){
alert("商品价格不能为空")
}else if(isNaN(newPrice)){
alert("商品价格必须是数字")
}else{
shop.price = parseInt(newPrice);
}
}
//增加数量
$scope.add = function(shop){
shop.num++;
}
//减少数量
$scope.less = function(shop){
if(shop.num>=1){//商品数量大于1
shop.num--;
}else{
}
}
//全选、全不选
$scope.selectAll = false;
$scope.selectAllFun = function() {
if($scope.selectAll) {
for(index in $scope.shops) {
$scope.shops[index].state = true;
}
} else {
for(index in $scope.shops) {
$scope.shops[index].state = false;
}
}
}
//反选
$scope.checkSelAll = function() {
var flag = false;
for(index in $scope.shops) {
if(!$scope.shops[index].state) {
//满足条件
flag = true;
}
}
if(flag) {
$scope.selectAll = false;
} else {
$scope.selectAll = true;
}
}
//批量删除
$scope.delSelect = function() {
var selArr = [];
for(index in $scope.shops) {
if($scope.shops[index].state) {
selArr.push($scope.shops[index].name)
}
}
if(selArr.length <= 0) {
alert("请先选择");
} else {
if(window.confirm("确定要删除吗？")) {
for(index1 in selArr) {
for(index2 in $scope.shops) {
if(selArr[index1] == $scope.shops[index2].name) {
$scope.shops.splice(index2, 1);
}
}
}
} else {
}
}
}
//添加商品
$scope.isShow = false;
$scope.isShow2 = false;
$scope.showForm = function() {
if($scope.isShow) {
$scope.isShow = false;
} else {
$scope.isShow = true;
}
}
//提交按钮
$scope.submit = function() {
$scope.errorArr = [];
//判断id是否为空
if($scope.newId == null || $scope.newId == "") {
$scope.errorArr.push("ID不能为空");
} else if(isNaN($scope.newId)) {
$scope.errorArr.push("ID必须是数字");
}
if($scope.newName == null || $scope.newName == "") {
$scope.errorArr.push("产品名称不能为空");
} else {
for(index in $scope.shops) {
if($scope.shops[index].name == $scope.newName) {
$scope.errorArr.push("产品名称不能重复");
}
}
}
if($scope.newPrice == null || $scope.newPrice == "") {
$scope.errorArr.push("价格不能为空");
} else if(isNaN($scope.newPrice)) {
$scope.errorArr.push("价格必须是数字");
}
if($scope.errorArr.length > 0) {
//显示列表
$scope.isShow2 = true;
} else {
$scope.isShow2 = false;
//添加商品
var newShop = {
id: parseInt($scope.newId),
name: $scope.newName,
price: parseInt($scope.newPrice),
num:1,
state: false
};
$scope.shops.push(newShop);
$scope.isShow = false;
}
}
})
</script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<center>
<h3>商品列表</h3>
<input type="text" placeholder="商品名称" ng-model="search" />
<select ng-model="orderSel">
<option value="">--请选择--</option>
<option value="id">--id正序--</option>
<option value="-id">--id逆序--</option>
<option value="price">--价格正序--</option>
<option value="-price">--价格逆序--</option>
</select>
<button ng-click="delSelect()">批量删除</button>
<br /><br />
<table border="1px solid blue;" cellpadding="10" cellspacing="0">
<thead>
<tr>
<th><input type="checkbox" ng-model="selectAll" ng-click="selectAllFun()" /> </th>
<th>产品编号</th>
<th>产品名称</th>
<th>产品价格</th>
<th>产品数量</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="shop in shops | filter:{name:search} | orderBy:orderSel">
<td><input type="checkbox" ng-model="shop.state" ng-click="checkSelAll()" /></td>
<td>{{shop.id}}</td>
<td>{{shop.name}}</td>
<td>{{shop.price}}</td>
<td>
<button ng-click="less(shop)">-</button>
<input type="text" ng-model="shop.num" size="1"/>
<button ng-click="add(shop)">+</button>
</td>
<td width="100px">
<button ng-click="de(shop.name,shop.state)">删除</button>
<button ng-click="update(shop)">修改</button>
</td>
</tr>
</tbody>
</table><br />
<button ng-click="showForm()">添加商品</button><br /><br />
<fieldset ng-show="isShow" id="" style="width: 400px;">
<legend>添加商品</legend><br />
<form>
产品编号：<input type="text" ng-model="newId" /><br /><br /> 产品名称：
<input type="text" ng-model="newName" /><br /><br /> 产品价格：
<input type="text" ng-model="newPrice" /><br /><br />
<ul ng-show="isShow2" style="width: 200px; background-color: #f89;">
<li ng-repeat="error in errorArr">{{error}}</li>
</ul>
<input ng-click="submit()" type="button" value="添加" />
</form>
</fieldset>
</center>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>垃圾比</title>
<script type="text/javascript" src="angular/angular.js" ></script>
<style>
.tab tr:nth-child(even) {
background: #F00;
}
.tab tr:nth-child(odd) {
background: #00f;
}
.lal{
cursor: pointer;
}
</style>
<script>
var app =angular.module("app",[]);
app.controller("con",function($scope){
$scope.shops=[
{name:"张三",age:45,pinyin:"zhangsan",zhiwei:"总经理"},
{name:"李四",age:43,pinyin:"lisi",zhiwei:"设计师"},
{name:"王五",age:40,pinyin:"wangwu",zhiwei:"工程师"},
{name:"赵六",age:33,pinyin:"zhaoliu",zhiwei:"工程师"},
{name:"周七",age:32,pinyin:"zhouqi",zhiwei:"人事经理"}
];
$scope.del=function(name){
if(window.confirm("确认要删除么"+name+"么")){
for(index in $scope.shops){
if(name==$scope.shops[index].name){
$scope.shops.splice(index,1);
}
}
}
}
$scope.tianjia=function(){
if($scope.addname==undefined||$scope.addname==""){
alert("姓名不能为空");
return;
}
if($scope.addage==undefined||$scope.addage==""){
alert("年龄不能为空");
return;
}
if($scope.addpinyin==undefined||$scope.addpinyin==""){
alert("拼音不能为空");
return;
}
if($scope.addzhiwei==undefined||$scope.addzhiwei==""){
alert("职位不能为空");
return;
}
};
});
</script>
</head>
<body ng-app="app" ng-controller="con">
<center>
姓名查询条件<input type="text" ng-model="search" ng-click="dinaji()" />
<select ng-model="orderSel">
<option value="-age">按照年龄倒序</option>
<option value="age">按照年龄正序</option>
</select>
<br />
用户列表
<table border="1" cellpadding="10" cellspacing="0" class="tab">
<th>姓名</th>
<th>年龄</th>
<th>拼音</th>
<th>职位</th>
<th>操作</th>
<tbody >
<tr ng-repeat="people in shops |filter:{name:search}|orderBy:orderSel">
<td>{{people.name}}</td>
<td>{{people.age}}</td>
<td>{{people.pinyin}}</td>
<td>{{people.zhiwei}}</td>
<td>
<button ng-click="del(people.name)" class="lal">删除</button>
</td>
</tr>
</tbody>
</table>
<br /><br />
<button>查询</button>
<button>添加用户</button>
<h2>用户信息添加页</h2>
姓名<input type="text" ng-model="addname"/><br /><br />
年龄<input type="text" ng-model="addage"/><br /><br />
拼音<input type="text" ng-model="addpinyin"/><br /><br />
职位<input type="text" ng-model="addzhiwei"/><br /><br />
<br /><br />
<button ng-click="tianjia()">保存</button>
</center>
</body>
</html>
$scope.tianjia=function(){//实现添加数据的功能
if($scope.addid==undefined||$scope.addid==""){
alert("资产编号不能为空");
return;
}
if($scope.addname==undefined||$scope.addname==""){
alert("资产名称不能为空");
return;
}
if($scope.addnum==undefined||$scope.addnum==""){
alert("资产数量不能为空");
return;
}
if(isNaN($scope.addid)){
alert("资产编号必须是数字")
return;
}
if($scope.addid.length!=8){
alert("资产标号长度必须为8")
return;
}
if(isNaN($scope.addnum)){
alert("资产数量必须是数字")
return;
}
for(index in $scope.zichan){
if($scope.zichan[index].name==$scope.addname){
alert("该资产已存在")
return;
}
}
$scope.zichan.push({
id:$scope.addid,
name:$scope.addname,
num:$scope.addnum,
});
}
$scope.wa=function(){
if($scope.sousuo==undefined||$scope.suosou==""){
alert("输入内容不能为空");
return;
}
for(index in $scope.zichan){
if($scope.zichan[index].name==$scope.sousuo){
alert("搜到相关内容")
return;
}
}
for(index in $scope.zichan){
if($scope.sousuo!=undefined||$scope.zichan[index].name!=$scope.sousuo){
alert("未搜索到相关内容")
return;
}
}
}
});
5364
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
