<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.min.js"></script>
<script>
angular.module("zhao",[]).controller("tro",function($scope,$http){
$http.get("http://result.eolinker.com/lKgJQ8Zec38423e5603b8e055d1193a8127c0c060bb1b55?uri=goodstest").success(function(d){
$scope.date=d;
}
)
//全选
$scope.qx=function(){
for(var i in $scope.date){
$scope.date[i].ck=$scope.id;
}
}
//删除
$scope.ll=function(){
for(var i=0;i<$scope.date.length;i++){
if($scope.date[i].ck && $scope.date[i].state=="已发货"){
$scope.date.splice(i,1);
i--;
}
}
}
//多选查询
$scope.so=function(){
$scope.gn=$scope.gn1;
$scope.un=$scope.un1;
$scope.st=$scope.st1;
}
//添加
$scope.tj=function(){
if($scope.gname=='' || $scope.gname==null){
$scope.u=true;
}
if($scope.uname=='' || $scope.uname==null){
$scope.i=true;
}
if($scope.tel=='' || $scope.tel==null){
$scope.o=true;
}
if($scope.price=='' || $scope.price==null){
$scope.p=true;
}
if($scope.city=='' || $scope.city==null){
$scope.u=true;
}
else{
$scope.regdate=new Date();
$scope.date.push({id:$scope.date.length+1,gname:$scope.gname,uname:$scope.uname,tel:$scope.tel,price:$scope.price,provice:$scope.provice,city:$scope.city,regdate:$scope.regdate,state:"未发货"});
$scope.aa=false;
}
}
//修改
$scope.xg=function(d){
$scope.up=d;
$scope.upd=true;
}
})
</script>
</head>
<body ng-app="zhao" ng-controller="tro">
<center>
<table border="1" >
<tr>
<td></td>
<td><input type="button" ng-click="aa=true" value="新增信息"></td>
<td><button ng-click="ll()">批量删除</button></td>
<td colspan="2">
<input type="texxt" ng-model="gn1" placeholder="请输入要搜索内容"/>
</td>
<td colspan="2">
<input type="texxt" ng-model="un1" placeholder="请输入要搜索内容"/>
</td>
<td colspan="1">
<select ng-model="st1">
<option value="">请您选择要搜索内容</option>
<option>未发货</option>
<option>已发货</option>
</select>
</td>
<td>
<button ng-click="so()">搜索</button>
</td>
</tr>
<tr>
<td><input type="checkbox" ng-model="id" ng-click="qx()"></td>
<td>id<input type="button" ng-click="px='id';sj=!sj" value="排序"></td>
<td>gname</td>
<td>uname</td>
<td>tel</td>
<td>price<input type="button" ng-click="px='price';sj=!sj" value="排序"></td>
<td>city</td>
<td>regdate</td>
<td>state</td>
<td>操作</td>
</tr>
<tr ng-repeat="n in date|filter:{gname:gn,tel:un,state:st}|orderBy:px:sj">
<td><input type="checkbox" ng-model="n.ck"></td>
<td>{{n.id}}</td>
<td>{{n.gname}}</td>
<td>{{n.uname}}</td>
<td>{{n.tel}}</td>
<td>{{n.price|currency:"¥:"}}</td>
<td>{{n.provice}}--{{n.city}}</td>
<td>{{n.regdate|date:"yyyy-MM-dd hh:mm:dd"}}</td>
<td>
<span style="background: red;" ng-show="n.state=='已发货'">
已发货
</span>
<span style="background:yellow;" ng-show="n.state=='未发货'">
<a href="#" ng-click="n.state='已发货'">未发货</a>
</span>
</td>
<td><button ng-click="xg(n)">修改</button></td>
</tr>
</table>
<table border="1" ng-show="aa">
<form >
<tr>
<td>
gname:<input ng-model="gname" /><span ng-show="u">不能为空</span>
</td>
</tr>
<tr>
<td>
uname:<input ng-model="uname" /><span ng-show="i">不能为空</span>
</td>
</tr>
<tr>
<td>
tel:       <input ng-model="tel" /><span ng-show="o">不能为空</span>
</td>
</tr>
<tr>
<td>
price:   <input ng-model="price" /><span ng-show="p">不能为空</span>
</td>
</tr>
<tr>
<td>
city:      <select id="ce" ng-model="provice" onchange="ch()">
<option value="">请选择</option>
<option>北京</option>
<option>河南</option>
<option>上海</option>
</select>
<select id="shi" ng-model="city"></select><span ng-show="l">不能为空</span>
</td>
</tr>
<tr>
<td>
<input type="button" value="添加" ng-click="tj()" />
</td>
</tr>
</form>
</table>
<form ng-show="upd">
gname:<input ng-model="up.gname" /><br />
uname:<input ng-model="up.uname" /><br />
tel:<input ng-model="up.tel" /><br />
price:<input ng-model="up.price" /><br />
provice:<select ng-model="up.provice"><br />
<option>北京</option>
<option>河南</option>
<option>上海</option>
</select>
city:<select ng-model="up.city">
<option ng-show="up.provice=='北京'">朝阳</option>
<option ng-show="up.provice=='北京'">昌平</option>
<option ng-show="up.provice=='河南'">安阳</option>
<option ng-show="up.provice=='河南'">濮阳</option>
<option ng-show="up.provice=='上海'">浦西</option>
<option ng-show="up.provice=='上海'">浦东</option>
</select><br />
<button ng-click="upd=false">保存修改</button>
</form>
</center>
</body>
<script src="js/jquery-1.11.1.js"></script>
<script>
var cheng=[{pro:'北京',cit:['朝阳','昌平']},{pro:'上海',cit:['浦东','浦西']},{pro:'河南',cit:['安阳','濮阳']}];
function ch(){
var ss=[];
var p=$("#ce").val();
for(var i=0;i<cheng.length;i++){
if(p==cheng[i].pro){
ss=cheng[i].cit;
}
}
$("#shi option").remove();
for(var i=0;i<ss.length;i++){
var op=("<option>"+ss[i]+"</option>");
$("#shi").append(op);
}
}
</script>
</html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/angular.min.js"></script>
<script>
angular.module("zhao",[]).controller("tro",function($scope,$http){
$http.get("http://result.eolinker.com/lKgJQ8Zec38423e5603b8e055d1193a8127c0c060bb1b55?uri=goodstest").success(function(d){
$scope.date=d;
}
)
//全选
$scope.qx=function(){
for(var i in $scope.date){
$scope.date[i].ck=$scope.id;
}
}
//删除
$scope.ll=function(){
for(var i=0;i<$scope.date.length;i++){
if($scope.date[i].ck && $scope.date[i].state=="已发货"){
$scope.date.splice(i,1);
i--;
}
}
}
//多选查询
$scope.so=function(){
$scope.gn=$scope.gn1;
$scope.un=$scope.un1;
$scope.st=$scope.st1;
}
//添加
$scope.tj=function(){
if($scope.gname=='' || $scope.gname==null){
$scope.u=true;
}
if($scope.uname=='' || $scope.uname==null){
$scope.i=true;
}
if($scope.tel=='' || $scope.tel==null){
$scope.o=true;
}
if($scope.price=='' || $scope.price==null){
$scope.p=true;
}
if($scope.city=='' || $scope.city==null){
$scope.u=true;
}
else{
$scope.regdate=new Date();
$scope.date.push({id:$scope.date.length+1,gname:$scope.gname,uname:$scope.uname,tel:$scope.tel,price:$scope.price,provice:$scope.provice,city:$scope.city,regdate:$scope.regdate,state:"未发货"});
$scope.aa=false;
}
}
//修改
$scope.xg=function(d){
$scope.up=d;
$scope.upd=true;
}
})
</script>
</head>
<body ng-app="zhao" ng-controller="tro">
<center>
<table border="1" >
<tr>
<td></td>
<td><input type="button" ng-click="aa=true" value="新增信息"></td>
<td><button ng-click="ll()">批量删除</button></td>
<td colspan="2">
<input type="texxt" ng-model="gn1" placeholder="请输入要搜索内容"/>
</td>
<td colspan="2">
<input type="texxt" ng-model="un1" placeholder="请输入要搜索内容"/>
</td>
<td colspan="1">
<select ng-model="st1">
<option value="">请您选择要搜索内容</option>
<option>未发货</option>
<option>已发货</option>
</select>
</td>
<td>
<button ng-click="so()">搜索</button>
</td>
</tr>
<tr>
<td><input type="checkbox" ng-model="id" ng-click="qx()"></td>
<td>id<input type="button" ng-click="px='id';sj=!sj" value="排序"></td>
<td>gname</td>
<td>uname</td>
<td>tel</td>
<td>price<input type="button" ng-click="px='price';sj=!sj" value="排序"></td>
<td>city</td>
<td>regdate</td>
<td>state</td>
<td>操作</td>
</tr>
<tr ng-repeat="n in date|filter:{gname:gn,tel:un,state:st}|orderBy:px:sj">
<td><input type="checkbox" ng-model="n.ck"></td>
<td>{{n.id}}</td>
<td>{{n.gname}}</td>
<td>{{n.uname}}</td>
<td>{{n.tel}}</td>
<td>{{n.price|currency:"¥:"}}</td>
<td>{{n.provice}}--{{n.city}}</td>
<td>{{n.regdate|date:"yyyy-MM-dd hh:mm:dd"}}</td>
<td>
<span style="background: red;" ng-show="n.state=='已发货'">
已发货
</span>
<span style="background:yellow;" ng-show="n.state=='未发货'">
<a href="#" ng-click="n.state='已发货'">未发货</a>
</span>
</td>
<td><button ng-click="xg(n)">修改</button></td>
</tr>
</table>
<table border="1" ng-show="aa">
<form >
<tr>
<td>
gname:<input ng-model="gname" /><span ng-show="u">不能为空</span>
</td>
</tr>
<tr>
<td>
uname:<input ng-model="uname" /><span ng-show="i">不能为空</span>
</td>
</tr>
<tr>
<td>
tel:       <input ng-model="tel" /><span ng-show="o">不能为空</span>
</td>
</tr>
<tr>
<td>
price:   <input ng-model="price" /><span ng-show="p">不能为空</span>
</td>
</tr>
<tr>
<td>
city:      <select id="ce" ng-model="provice" onchange="ch()">
<option value="">请选择</option>
<option>北京</option>
<option>河南</option>
<option>上海</option>
</select>
<select id="shi" ng-model="city"></select><span ng-show="l">不能为空</span>
</td>
</tr>
<tr>
<td>
<input type="button" value="添加" ng-click="tj()" />
</td>
</tr>
</form>
</table>
<form ng-show="upd">
gname:<input ng-model="up.gname" /><br />
uname:<input ng-model="up.uname" /><br />
tel:<input ng-model="up.tel" /><br />
price:<input ng-model="up.price" /><br />
provice:<select ng-model="up.provice"><br />
<option>北京</option>
<option>河南</option>
<option>上海</option>
</select>
city:<select ng-model="up.city">
<option ng-show="up.provice=='北京'">朝阳</option>
<option ng-show="up.provice=='北京'">昌平</option>
<option ng-show="up.provice=='河南'">安阳</option>
<option ng-show="up.provice=='河南'">濮阳</option>
<option ng-show="up.provice=='上海'">浦西</option>
<option ng-show="up.provice=='上海'">浦东</option>
</select><br />
<button ng-click="upd=false">保存修改</button>
</form>
</center>
</body>
<script src="js/jquery-1.11.1.js"></script>
<script>
var cheng=[{pro:'北京',cit:['朝阳','昌平']},{pro:'上海',cit:['浦东','浦西']},{pro:'河南',cit:['安阳','濮阳']}];
function ch(){
var ss=[];
var p=$("#ce").val();
for(var i=0;i<cheng.length;i++){
if(p==cheng[i].pro){
ss=cheng[i].cit;
}
}
$("#shi option").remove();
for(var i=0;i<ss.length;i++){
var op=("<option>"+ss[i]+"</option>");
$("#shi").append(op);
}
}
</script>
</html>