发表于: 2016-07-24 23:58:37

1 2356


今天完成的事:

完成了批量删除的功能,学习了下拉插件

明天要做的事:

学习factory的用法,修改task5,感觉自己jq的选择器超不熟悉,再多学习学习



收货:

1批量删除的功能:

其实就是两个步骤:第一获取到chexbox的value值就是每一个数据的id值,第二是转换成接口的格式发出请求

1.1首先需要在ng-repeat中给每一个checkbox赋上id的值

<th ><input type="checkbox" name="checkbox" value={{a.id}}></th>

然后新建一个空数组用于存放被选中的多选框的id值

var yyy = [];


var temp = document.getElementsByName('checkbox');

for (var i = 0; i < temp.length; i++) {
if (temp[i].checked == true) {
yyy.push(temp[i].value);
   }
}

通过push的方法把id值添加到新建的数组中

1.2通过join的方法把数组中的值转换成需要发出请求的格式

var ss = yyy.join('&id=');

最后发出请求

$http.post("a/students?id=" + ss)
.success(function () {
alert("删除成功");
       $state.go('main.home', '', {reload: true});
   })

输出的格式是  ?id=1&id=2&id=3.......



然后给多选框添加一个全选和全部不选的功能

对checkbox的其他几个操作 
1. 全选 
2. 取消全选 
3. 选中所有奇数 
4. 反选 
5. 获得选中的所有值 
js代码 
复制代码代码如下:
$("document").ready(function(){ 
$("#btn1").click(function(){ 
$("[name='checkbox']").attr("checked",'true');//全选 
}) 
$("#btn2").click(function(){ 
$("[name='checkbox']").removeAttr("checked");//取消全选 
}) 
$("#btn3").click(function(){ 
$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数 
}) 
$("#btn4").click(function(){ 
$("[name='checkbox']").each(function(){//反选 
if($(this).attr("checked")){ 
$(this).removeAttr("checked"); 
else{ 
$(this).attr("checked",'true'); 
}) 
}) 
$("#btn5").click(function(){//输出选中的值 
var str=""; 
$("[name='checkbox'][checked]").each(function(){ 
str+=$(this).val()



然后我在具体操作中并没有实现全选的功能,最后在李恒大神的帮助下,发现获取到的[name='checked]'不是一个字符串而是数组没法使用

attr的功能

$scope.checkall = function () {

var aa = $("#allcheck")[0].checked;  // 一开始没写[0]结果就没有成功。。。。。aa代表被选中的状态
   var bb = $("input");     //表示所有input框
   for (var i = 0; i < bb.length; i++) {
bb[i].checked = aa;       //循环给所有input框添加选中
   }
}



然后今天还学习了一个下拉插件的使用

首先引入

<!--移动表单或表格中一行位置的插件-->
<script src="vendor/angular-drag-and-drop-lists/angular-drag-and-drop-lists.js"></script>

然后再路由中添加注入

angular.module('app', ['ui.router', 'oc.lazyLoad','mgcrea.ngStrap','ngMessages','dndLists'])
//加载路由

最后一个'dndlists'


最后在页面中添加初始化设置

<tbody dnd-list="vm.stuList" class="ul-table">
<!--track by $index-->
<tr ng-repeat="stu in vm.stuList"
   dnd-draggable="stu"
   data-dnd-moved="vm.stuList.splice($index, 1)"
   data-dnd-effect-allowed="move"

   data-dnd-selected="vm.stuList.selected == stu?vm.stuList.selected = '':vm.stuList.selected = stu"
   ng-class="{'selected': vm.stuList.selected == stu}"

   class="text-center">

<td></td>

<td></td>






最最后是一个强制刷新的功能(我的百度富文本编辑器还是没有搞定,但是别的还是挺好用的)

$state.go('main.home',{},{reload:true});
ui-sref="xxxx" ui-sref-opt="{reload:true}

推荐使用第一种,第二种不太靠谱

但是奎哥说能用ui-sref就用  不要转换成 ng-click 然后再去$state.go 好low




然后每日必写的:要抱紧柯基,李恒,杨永东,蔡源,启辰,奎哥等各路大神的大腿



今天特别感谢李恒大神    6666666666666666666


返回列表 返回列表
评论

    分享到