01.这次后台开始；
顺序依次是dao->xml->service->serviceimpl->controller->html
02.dao接口
public int doDeleteObjects(@Param("ids") Integer... ids);
03.xml文件
<update id="doDeleteObjects" >
delete from sys_logs
<choose>
<when test="ids.length>0 and ids!=null">
<where>
<foreach collection="ids" separator="or" item="id">
id=#{id}
</foreach>
</where>
</when>
<otherwise>
where 1==2
</otherwise>
</choose>
</update>
04.service接口
public int doDeleteObjects(@Param("ids")Integer... ids) ;
05.serviceimpl实现类
@Override
public int doDeleteObjects(Integer... ids) {
if (ids.length==0||ids==null)
{
throw new IllegalArgumentException("请选择一个");
}
int rows=0;
try {
rows=sysLogdao.doDeleteObjects(ids);
}catch (Throwable e)
{
e.printStackTrace();
throw new serivceException("系统在修复中");
}
if (rows==0)
{
throw new serivceException("数据不存在");
}
return rows;
}
06.controller类
@RequestMapping("doDeleteObjects")
@ResponseBody
public JsonResult doDeleteObjects(Integer...ids){
int rows= syslogservice.doDeleteObjects(ids);
return new JsonResult("OK");
}
07.html文件
先在自动加载的函数中声明点击事件（delete功能）
$(".input-group-btn").on("click",".btn-delete",doDeleteObjects)
再去声明delete函数，使用的ajax的post方法。
其中的params是string类型的参数。
function doDeleteObjects() {
var url="log/doDeleteObjects";
var ids=doGetCheckedIds();
if(ids.length==0){
alert("至少选择一个");
return;
}
var params={"ids":ids.toString()};
$.post(url,params,function (result) {
//请问result是一个字符串还是json格式的js对象？对象
if(result.state==1){
alert(result.message);
doGetObjects();
}else{
alert(result.message);
}
})
}
function doGetCheckedIds() {
//定义一个数组,用于存储选中的checkbox的id值
var array=[];//new Array();
//获取tbody中所有类型为checkbox的input元素
$("#tbodyId input[type=checkbox]").
//迭代这些元素，每发现一个元素都会执行如下回调函数
each(function(){
//假如此元素的checked属性的值为true
if($(this).prop("checked")){
/调用数组对象的push方法将选中对象的值存储到数组
array.push($(this).val());
}
});
return array;
}
用到的html中的方法：
使用的each方法遍历，$(this)表示当前元素
使用prop获取当前的属性：checked是一个表单标签input中的属性，就叫做checked。
涉及到的html标签
<td><input type='checkbox' class='cBox' name='cItem' value='"+data.id+"'></td>
这个是单个选中后的功能
那全选的delete功能是如何实现的？
08.首先就是实现全选后所有的在那一页出现的checkbox都可以被选中。
先给全选按钮增加点击事件。由于是表单，而且需要的是01.全选后02.在按下delete按钮后才可以delete
这里使用的是change函数，不是click函数
（一般button用click点击事件，表单的input【type=checkbox】使用的是change事件）
$("#checkAll").change(doChangeTBodyCheckBoxState)
#checkAll是id属性是checkAll的一个input【type=checkbox】的标签，表示全选
通过prop来获取checked属性的值，而后把table中的input【type=checkbox】的标签的checked属性的值都改成真
jQuery中的prop函数的取值和赋值两种用法。
//修改tbody中checkbox对象状态
function doChangeTBodyCheckBoxState() {
//1.获取当前点击对象的checked属性的值
var theadCheckBoxState = $(this).prop("checked");
//2.将tbody中所有checkbox元素的值都修改为checkall对应的值。
$("#tbodyId input[type=checkbox]").prop("checked",theadCheckBoxState);
}
那么，如果table中显示的某一行数据取消的选择，那么全选按钮应该不被勾选才对。
同样在table（id=tbodyId）的input【type=checkbox】有一个change事件
在自动加载函数中使用：
$("#tbodyId").on("change",".cBox",doChangeTHeadCheckBoxState);
});
//修改thead中的checkbox对象的状态
function doChangeTHeadCheckBoxState() {
//1.定义变量表示，默认值为true
var flag=true;
//2.获取所有的tbody中的checkbox对象的值，进行逻辑与操作
$("#tbodyId input[type='checkbox']").each(function () {
flag=flag&&$(this).prop("checked"); //true&&true/false
})
//3.修改thread中的checkbox对象状态
$("#checkAll").prop("checked",flag);
}
更新页面后，全选按钮不选中：
这个功能要在更新table数据的函数中去添加：
$("#checkAll").prop("checked",false);
function doGetObjects() {
$("#checkAll").prop("checked",false);
//发送json请求，接受数据
//1.定义url和参数
var pageCurrent=$("#pageId").data("pageCurrent");
//为什么要执行如下语句的判定，然后初始化pageCurrent的值为1
//pageCurrent参数在没有赋值的情况下，默认初始值应该为1.
if(!pageCurrent) pageCurrent=1;
var params={"pageCurrent":pageCurrent};//pageCurrent=2
var username=$("#searchNameId").val();
if(username) params.username=username;//查询时需要
var url="log/doFindPageObjects";
//2.发起异步请求,getjson方法
$.getJSON(url,params,function (result) {
//请问result是一个字符串还是json格式的js对象？对象
console.log(result);
dohandlerresult(result);
})
}
09.调试bug，如果在最后一页使用全选delete功能的时候，pageCurrent的值不能像往常一样，从后+1更新table中的数据，而是需要-1，向前去更新数据。
function doRefreshAfterDeleteOK(){
var pageall=$("#pageId").data("pageall");
var pageCurrent=$("#pageId").data("pageCurrent");
var checked=$("#checkAll").prop("checked");
if(pageCurrent==pageall&&checked&&pageCurrent>1){
pageCurrent--;
$("#pageId").data("pageCurrent",pageCurrent);
}
doGetObjects();
}
这里的data接受的数据是在page.html那个分页功能是已经存好了。
这里需要更新delete函数：
function doDeleteObjects() {
var ids=doGetCheckedId();
if (ids.length==0){
alert("至少选一个");
return;
}
if(!confirm("确认删除吗？"))return;
var url="log/doDeleteObjects";
var params={"ids":ids.toString()};
console.log(params);
$.post(url,params,function (result) {
if(result.state==1){
alert(result.message);
//doGetObjects();
doRefreshAfterDeleteOK();
}else {
alert(result.message);
}
});
}
