HTML代码如下
<button type="button" id="update_btn" onclick="updateChecked()">更新已选</button>
<button type="button" id="update_btn_all" onclick="updateAll()">全部更新</button>
<table id="basicTable" class="table"> <thead class=""> <tr> <th>全选 <input type="checkbox" name="checkedAll" id="checkedAll" onclick="swapCheck()"/> </th> <th>ID</th> <th>车系ID</th> <th>车龄</th> <th>操作</th> </tr> </thead> <tbody> <c:forEach items="${result }" var="bean"> <tr> <th> <input type="checkbox" name="beanIds" id="beanIds" value="${bean.id}"}/> </th> <th>${bean.id }</th> <th>${bean.seriesId }</th> <th>${bean.carAge }</th> <th> <button type="button" onclick='openedit(${bean })'>修改</button> </th> </tr> </c:forEach> </tbody> </table>
js代码如下
var isCheckAll = false;
//全选/全不选 操作 function swapCheck() { if (isCheckAll) { $("input[name='beanIds']").each(function() { this.checked = false; }); isCheckAll = false; } else { $("input[name='beanIds']").each(function() { this.checked = true; }); isCheckAll = true; } }
//更新按钮触发方法 function updateChecked(){ var beanIds = $("input[name='beanIds']:checked").serialize(); if(beanIds==null || beanIds ==''){ alert("请选择需要更新的记录"); return; } updateSeries(beanIds); }
function updateAll(){
updateSeriesRvFactor({beanIds:'all'});
}
//ajax 提交 function updateSeries(beanIds){ $.ajax({ url : '${ctx }/ajax/conf/updateSeries', data : beanIds, type : 'post', dataType : 'json', async : true, beforeSend: function () { // 禁用按钮防止重复提交 $("#update_btn_all").text("更新中..."); $("#update_btn_all").attr({ disabled: "disabled" }); $("#update_btn").text("更新中..."); $("#update_btn").attr({ disabled: "disabled" }); }, success : function(data) { alert(data.message); }, complete: function () { $("#update_btn_all").text("全部更新"); $("#update_btn_all").removeAttr("disabled"); $("#update_btn").text("更新已选"); $("#update_btn").removeAttr("disabled"); } }); }