页面实现全选和批量操作

全选的思路是：遍历标签下的type为checkbox的input标签，改变这些checkbox的check状态和点击全选的状态一样

批量操作的思路是：用js获取记录中的id用逗号拼接，传到后台执行批量操作的处理

 

全选js：

 

$("#checkAll").click(function() {
		var rows = $("#content").find('input');
		for (var i = 0; i < rows.length; i++) {
			if (rows[i].type == "checkbox") {
				var e = rows[i];
				e.checked = this.checked;
			}
		}
	});

批量操作：

 

html：

 

<input name="checkid" type="checkbox" id="checkid" value="'+id+'">

js：

 

 

//批量操作
	$("#save").click(function() {
		var checkid = document.getElementsByName("checkid");
		var str = "";
		for (var j = 0; j < checkid.length; j++) {
			if (checkid[j].checked == true) {
				str += checkid[j].value + ",";
			}
		}
		if(str == ""){
			JsUtils.show("请选择至少一条记录！");
			return false;
		}
		var flag = $("#command option:selected").val();
		if(flag == "-1"){
			JsUtils.show("请选择操作！");
			return false;
		}
		JsUtils.show("确定执行该操作?", guessList.save);
	});

 

//批量操作保存
		save : function() {
			var checkid = document.getElementsByName("checkid");
			var str = "";
			for (var j = 0; j < checkid.length; j++) {
				if (checkid[j].checked == true) {
					str += checkid[j].value + ",";
				}
			}
			var flag = $("#command option:selected").val();
			if (flag != "-1") {
				guessList.ajaxPost(flag, str);
			}
		},
		//批量操作
		ajaxPost : function(flag,ids) {
			$.ajax({
				type : "POST",
				async:true,
				url : ctx+"/rec/ges/batchUpdate",
				data : {
					"flag": flag,
					"ids": ids
				},
				dataType : "json",
				success : function(data, textStatus) {
					if (data.rtnCode == 0) {
						JsUtils.show("更新成功",function(){
							window.location.href = ctx+"/recommend/guess";
						});
					} else {
						JsUtils.show("操作失败，请重试！");
					}
				},
				error : function(XMLHttpRequest, textStatus, errorThrown) {
					JsUtils.show("系统忙，请稍后再试！");
				}
			});
		},

 

 

java后台处理：

 

@RequestMapping(value = "/ges/batchUpdate", method = RequestMethod.POST)
	@ResponseBody
	public Map<String, Object> batchUpdate(String flag, String ids)
			throws Exception
	{
		Map<String, Object> result = new HashMap<String, Object>();
		String[] idsArray = null;
		if (StringUtils.isNotEmpty(ids))
		{
			idsArray = ids.split(",");
			List<String> idList = Arrays.asList(idsArray);
			if ("0".equals(flag))
			{
				guessService.openRec(idList);
			}
			if ("1".equals(flag))
			{
				guessService.closeRec(idList);
			}
			if ("2".equals(flag))
			{
				guessService.delByIds(idList);
			}
		}
		result.put("rtnCode", 0);
		return result;
	}

 

 

mybatis配置：

 

<delete id="delByIds" parameterType="java.lang.String">
		DELETE FROM ges WHERE id IN 
		<foreach item="idItem" collection="list" open="(" separator="," close=")">
		#{idItem}
		</foreach>
	</delete>

Mapper：

 

 

void delByIds(List<String> ids);