復選框批量刪除操作-jquery方式


1.首先在頁面添加一個批量刪除的按鈕:<li class="btns"><input id="deleteSubmit" class="btn btn-primary" type="submit" value="批量刪除"/></li>

2.在列表項中添加設置復選框:

<table id="contentTable" class="table table-striped table-bordered table-condensed">

<thead>
<tr>
<th>
      <input type="checkbox" id="checkAll">全選
</th>
<th>序號</th>
<th>時間</th>
<th>姓名</th>
<th>性別</th>
<th>畢業學校</th>
</tr>
</thead>

<tbody>

<td>
<input type="checkbox" name="subBox" value="${xgStudentRegistration.id}"/>
</td>

</tbody>

</table>

2.使用jquery獲取復選框選中的對應item的id

<html>
<head>

<script type="text/javascript">
$(document).ready(function() {

//全選按鈕事件綁定
$(function() {
$("#checkAll").click(function() {
$('input[name="subBox"]').not("[disabled]").attr("checked",this.checked);
});
var $subBox = $("input[name='subBox']");
$subBox.click(function(){

$("#checkAll").attr("checked",$subBox.length == $("input[name='subBox']:checked").length ? true : false);
});
});

$("#deleteSubmit").click(function(){
var chk_value =[];
$('input[name="subBox"]:checked').each(function(){
chk_value.push($(this).val());
});
if(chk_value.length<=0){
alert("請選擇要刪除的數據!");
}else{
if(confirm("你確定刪除嗎?")){
var s = chk_value.join(",");
location.href = '${ctx}/student/xgStudentRegistration/deleteChosse?id='+s;
return false;
}
}
});

</script>
</head>

</html>

3.在controller中操作:

@Controller
@RequestMapping(value = "${adminPath}/student/xgStudentRegistration")
public class XgStudentRegistrationController extends BaseController {

@RequiresPermissions("student:xgStudentRegistration:edit")
@RequestMapping(value = "deleteChosse")

public String deleteChosse(XgStudentRegistration xgStudentRegistration, RedirectAttributes redirectAttributes,String id) {
xgStudentRegistrationService.deleteChosse(id);
addMessage(redirectAttributes, "刪除信息成功");
return "modules/xg/student/xgStudentRegistrationList";
}

}

4.在service中操作:

public class XgStudentRegistrationService extends CrudService<XgStudentRegistrationDao, XgStudentRegistration>{

 

@Transactional(readOnly = false)
public void delete(XgStudentRegistration xgStudentRegistration) {
super.delete(xgStudentRegistration);
}

public void deleteChosse(String id) {
String[] list = id.split(",");
XgStudentRegistration xgStudentRegistration = new XgStudentRegistration();
for (String i : list) {
xgStudentRegistration.setId(i);
delete(xgStudentRegistration);
}
}

}

public abstract class CrudService<D extends CrudDao<T>, T extends DataEntity<T>> extends BaseService {

 

/**
* 持久層對象
*/
@Autowired
public D dao;

/**
* 刪除數據
* @param entity
*/
@Transactional(readOnly = false)
public void delete(T entity) {
dao.delete(entity);
}

}

**
* 學生咨詢登記DAO接口
* @author gh
* @version 2017-05-15
*/
@MyBatisDao
public interface XgStudentRegistrationDao extends CrudDao<XgStudentRegistration> {

}

5.在xml中delete

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.student.dao.XgStudentRegistrationDao">

<update id="delete">
UPDATE xg_student_registration SET
del_flag = #{DEL_FLAG_DELETE}
WHERE id = #{id}
</update>

</mapper>

 

 

tag:

jquery中的$(document).ready(function() {})這句話是什么 意思

這部分代碼主要聲明,頁面加載后 “監聽事件” 的方法。
例如:
$(document).ready(
$("a").click(function(){alert('你點我干嘛')});
);
這句的意思是:
頁面加載成功后,頁面內的所有鏈接在“點擊”事件的時候,提示“你點我干嘛”。

文檔就緒事件

所有 jQuery 函數位於一個 document ready 函數中:

$(document).ready(function(){ // 開始寫 jQuery 代碼... });

這是為了防止文檔在完全加載(就緒)之前運行 jQuery 代碼。

如果在文檔沒有完全加載之前就運行函數,操作可能失敗。下面是兩個具體的例子:

  • 試圖隱藏一個不存在的元素
  • 獲得未完全加載的圖像的大小

提示:簡潔寫法(與以上寫法效果相同):

$(function(){ // 開始寫 jQuery 代碼... });

以上兩種方式,選擇喜歡的方式實現文檔就緒后執行 jQuery 方法。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM