黑马程序员技术交流社区

标题: 【郑州校区】Java之品优购课程讲义_day02(6) [打印本页]

作者: 谷粒姐姐    时间: 2018-7-31 10:11
标题: 【郑州校区】Java之品优购课程讲义_day02(6)
删除品牌
6.1 需求分析
点击列表前的复选框,点击删除按钮,删除选中的品牌。
6.1 后端代码6.1.1 服务接口层
在 pinyougou-sellergoods-interface 的 BrandService.java 接口定义方法
[AppleScript] 纯文本查看 复制代码
/**

*批量删除

*@param  ids

*/

public  void  delete(Long  []  ids);
6.1.1 服务实现层
在 pinyougou-sellergoods-service 的 BrandServiceImpl.java 实现该方法
[AppleScript] 纯文本查看 复制代码
/**

* 批量删除
*/ @Override
[AppleScript] 纯文本查看 复制代码
public  void  delete(Long[]  ids)  {

for(Long  id:ids){ brandMapper.deleteByPrimaryKey(id);
}
6.1.1 控制层
在 pinyougou-manager-web 的 BrandController.java 中增加方法
[AppleScript] 纯文本查看 复制代码
/**

*批量删除

*@param  ids

*@return

*/ @RequestMapping("/delete")
public  Result  delete(Long  []  ids){

try {

brandService.delete(ids);

return  new  Result(true,  "删除成功");

}  catch  (Exception  e)  { e.printStackTrace();
return  new  Result(false,  "删除失败");

}

}
6.3 前端代码
6.3.1 JS
主要思路:我们需要定义一个用于存储选中 ID 的数组,当我们点击复选框后判断是选择还是取消选择,如果是选择就加到数组中,如果是取消选择就从数组中移除。在点击删除按钮时需要用到这个存储了 ID 的数组。
这里我们补充一下 JS 的关于数组操作的知识
(1)数组的 push 方法:向数组中添加元素
(2)数组的 splice 方法:从数组的指定位置移除指定个数的元素 ,参数 1 为位置 ,参数
2 位移除的个数
3)复选框的 checked 属性:用于判断是否被选中
[AppleScript] 纯文本查看 复制代码
$scope.selectIds=[];//选中的 ID 集合

//更新复选

$scope.updateSelection  =  function($event,  id)  {

if($event.target.checked){//如果是被选中,则增加到数组

$scope.selectIds.push(  id);

}else{

var  idx  =  $scope.selectIds.indexOf(id);

$scope.selectIds.splice(idx,  1);//删除

}

}

//批量删除

$scope.dele=function(){

//获取选中的复选框

$http.get('../brand/delete.do?ids='+$scope.selectIds).success(
[AppleScript] 纯文本查看 复制代码
function(response){ if(response.success){
$scope.reloadList();//刷新列表

}

}

);

}
6.3.1 HTML
(1)修改列表的复选框
[AppleScript] 纯文本查看 复制代码
<input    type="checkbox"  ng-click="updateSelection($event,entity.id)">
修改删除按钮
[AppleScript] 纯文本查看 复制代码
<button  type="button"  class="btn  btn-default"  title="删除"  ng-click="dele()"><i
class="fa  fa-trash-o"></i>  删除</button>







欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2