您的位置:首页 > Web前端 > JavaScript

自定义jsp标签实现复选框跨页多选

2017-03-19 14:39 776 查看
一、自定义jsp标签实现步骤简述

   1.继承SimpleTagSupport或BodyTagSupport类,自定义属性并添加get,set方法(类属性会自动映射到自定义标签属性),重写父类方法。

   2.配置.tld文件(配置自定义标签名,类路径,自定义标签属性等)

   3.引用自己实现的自定义标签到jsp中。

复选框跨页多选实现逻辑见我的上一篇博客(复选框跨页多选)。

二、标签功能描述

       1.跨页多选

       2.支持全选/取消全选

       3.支持不可选提示

       4.支持禁用

      缺陷:不支持默认已选择(默认即初始加载jsp页面)

三、下面直接贴代码

1.自定义类代码如下:

package com.talkweb.ecm.core.tags.checkbox;
import java.io.IOException;
import java.util.Enumeration;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.jsp.JspException;
import javax.servlet.jsp.JspWriter;
import javax.servlet.jsp.PageContext;
import javax.servlet.jsp.tagext.SimpleTagSupport;
/**
* 复选框跨页选择
*
* 代替复选框
* <input type="checkbox" onclick="updateCheckedIds(this)" value="${scene.id}"
<c:forTokens var="sceneId" items="${checkedIds}" delims=",">
<c:if test="${sceneId==scene.id}">checked="checked"</c:if>
</c:forTokens>
/>
* @author lxh
*
*/
public class CheckBoxTag extends SimpleTagSupport{
private static final String CHECKED_IDS="checkedIds";//action中变量名
private String value; //设置input标签的value值
private boolean checkedDisabledIf; //已选择禁用
private boolean disabledIf; //禁用
private String uncheckIfMsg; //是否“不能选择”,多个以"||"隔开,格式:boolean1:message1||boolean2:message2
private String style; //样式设置
private String onclick;
public String getOnclick() {
return onclick;
}
public void setOnclick(String onclick) {
this.onclick = onclick;
}
public String getUncheckIfMsg() {
return uncheckIfMsg;
}
public void setUncheckIfMsg(String uncheckIfMsg) {
this.uncheckIfMsg = uncheckIfMsg;
}
public boolean isCheckedDisabledIf() {
return checkedDisabledIf;
}
public void setCheckedDisabledIf(boolean checkedDisabledIf) {
this.checkedDisabledIf = checkedDisabledIf;
}
public boolean isDisabledIf() {
return disabledIf;
}
public void setDisabledIf(boolean disabledIf) {
this.disabledIf = disabledIf;
}
public String getStyle() {
return style;
}
public void setStyle(String style) {
this.style = style;
}
public String getValue() {
return value;
}
public void setValue(String value) {
this.value = value;
}
@Override
public void doTag() throws JspException, IOException {
PageContext pageContext = (PageContext) this.getJspContext();
HttpServletRequest request = (HttpServletRequest) pageContext.getRequest();
//获得输出对象
JspWriter out = getJspContext().getOut();

StringBuffer sb=new StringBuffer();

// 获取所有提交的参数(包括查询条件参数)
Enumeration enumeration = request.getParameterNames();
String name = "";
String checkedIds = "";
boolean flag=false;
while (enumeration.hasMoreElements()) {
name = (String) enumeration.nextElement();
if(CHECKED_IDS.equals(name)){
checkedIds = request.getParameter(name);//获取参数的值
flag=true;
break;
}
}
/**
*
*/
String unCheck=getFirstUnCheckIf();
String unCheckMsg=getFirstUnCheckMsg();

//是否有“不能选择”的条件,没有则不提示消息
if("".equals(unCheck)||unCheck==null){
unCheckMsg=null;
}

//添加jsp标签
sb.append("<input type='checkbox' ")
.append(" style='").append(style);
if(unCheckMsg!=null&&!"".equals(unCheckMsg)){
if(onclick!=null&&!"".equals(onclick)){
sb.append("' onclick=").append(onclick).append(";updateCheckedIds(this,'").append(unCheckMsg);

}else{
sb.append("' onclick=updateCheckedIds(this,'").append(unCheckMsg);
}
sb.append("') value='");
}else{
if(onclick!=null&&!"".equals(onclick)){
sb.append("' onclick=").append(onclick).append(";updateCheckedIds(this)");
}else{
sb.append("' onclick=updateCheckedIds(this)");
}
sb.append(" value='");
}
sb.append(value).append("' ");
//判断是否添加默认checked
if(checkedDisabledIf){
sb.append(" checked disabled ");
}
if(disabledIf){
sb.append(" disabled ");
}
//判断是否添加checked属性
if(flag&&checkedIds!=null){
String[] ids=checkedIds.split(",");
boolean f2=false;
for(int i=0;i<ids.length;i++){
if(ids[i]!=null&&ids[i].equals(value)){
f2=true;
}
}
if(f2){
sb.append("checked/> ");
}else{
sb.append("/> ");
}
}else{
sb.append("/> ");
}

out.println(sb.toString());
}
/**
* 当有多个条件时,从左向右找到第一个为true的条件
* @return
*/
private String getFirstUnCheckIf(){
if(uncheckIfMsg!=null&&!"".equals(uncheckIfMsg)){
String[] flags=uncheckIfMsg.split("\\|\\|");
for(String str: flags){
int index=str.indexOf(":");
if(index!=-1){
str=str.substring(0, index);
}
if("true".equals(str.trim())){
return str;
}
}
}
return "";
}

private int getFirstUnCheckIndex(){
int index=-1;
if(uncheckIfMsg!=null&&!"".equals(uncheckIfMsg)){
String[] flags=uncheckIfMsg.split("\\|\\|");
for(int i=0;i<flags.length;i++){
int ind=flags[i].indexOf(":");
if(ind!=-1){
flags[i]=flags[i].substring(0, ind);
}
if("true".equals(flags[i].trim())){
index=i;
break;
}
}
}
return index;
}
/**
* 当多个条件对应多个提示信息时,从左向右找到第一个条件为true所对应的提示信息
* @return
*/
private String getFirstUnCheckMsg(){
if(uncheckIfMsg!=null&&!"".equals(uncheckIfMsg)){

String[] msgs=uncheckIfMsg.split("\\|\\|");//"||"切割字符串

int i=getFirstUnCheckIndex();
if(i!=-1&&msgs.length>i){
int beginIndex=msgs[i].indexOf(":");
if(beginIndex!=-1){
msgs[i]=msgs[i].substring(beginIndex+1);
}
String msg=clearOtherMsg(msgs[i]);
return msg;
}
}
return "";
}
/**
* 去掉换行符\n,制表符\t
* @param str
* @return
*/
private String clearOtherMsg(String str){
if(str!=null){
str=str.replaceAll("\n", "");
str=str.replaceAll("\t","");
}
return str.trim();
}
}

package com.talkweb.ecm.core.tags.checkbox;

import java.io.IOException;
import java.util.Enumeration;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.jsp.JspException;
import javax.servlet.jsp.JspWriter;
import javax.servlet.jsp.PageContext;
import javax.servlet.jsp.tagext.SimpleTagSupport;
/**
* 复选框跨页选择
* 代替隐藏域
* <input type="hidden" name="checkedIds" id="checkedIds" value="${checkedIds}"/>
* @author lxh
*
*/
public class CheckedValues extends SimpleTagSupport{

private static final String CHECKED_IDS="checkedIds";//action中变量名
private String id;//标签元素唯一标识
private String type;//是否为checkbox标签
public String getType() {
return type;
}
public void setType(String type) {
this.type = type;
}
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
@Override
public void doTag() throws JspException, IOException {
PageContext pageContext = (PageContext) this.getJspContext();
HttpServletRequest request = (HttpServletRequest) pageContext.getRequest();

//获得输出对象
JspWriter out = pageContext.getOut();
StringBuffer sb=new StringBuffer();
//1.添加js函数
/**
* function updateCheckedIds(box){
//获得当前复选框的值
var boxval=box.value;
//历史获得所选的id,多个id以","分隔
var checkedIds=$('#checkedIds').val();
if(box.checked){
checkedIds+=","+boxval;
}else{
var strs=checkedIds.split(',');
checkedIds='';
for(var i=0;i<strs.length;i++){
if(strs[i]!=boxval){
checkedIds+=","+strs[i];
}
}
}
$('#checkedIds').val(checkedIds);
}
*/
sb.append("<script type='text/javascript'>")
.append(" function updateCheckedIds(box,msg){")
.append
bf47
("if(msg){box.checked=false;alert(msg);return;}")
.append("var boxval=box.value;")
.append("var obj=document.getElementById('").append(id).append("');var checkedIds='';")
.append("if(obj){checkedIds=obj.value}")
.append("if(box.checked){checkedIds+=','+boxval;}else{")
.append("var strs=checkedIds.split(',');checkedIds='';")
.append("for(var i=0;i<strs.length;i++){")
.append("if(strs[i]!=boxval){checkedIds+=','+strs[i];}")
.append("}}")
.append("if(obj){")
.append("if(checkedIds!=null&&checkedIds.length>1){")
.append("str=checkedIds.substr(0,1);if(str==','){checkedIds=checkedIds.substr(1,checkedIds.length);}}")
.append("obj.value=checkedIds;};};");

//是否显示checkbox标签来控制全选
if(type!=null&&type.equals("checkbox")){
//全选或取消全选
sb.append("function checkAll(obj){")
.append("var objs=document.getElementsByTagName('input');")
.append("if(obj.checked){")  //全选
.append("for(var i=0;i<objs.length;i++){")
.append("if(objs[i].type=='checkbox'&&objs[i].disabled==false&&objs[i].checked==false){")//获取没有勾选的
.append("objs[i].checked=true;updateCheckedIds(objs[i]);")
.append("}")
.append("}")
.append("}else{")   //全不选
.append("for(var i=0;i<objs.length;i++){")
.append("if(objs[i].type=='checkbox'&&objs[i].disabled==false&&objs[i].checked){")//获取没有勾选的
.append("objs[i].checked=false;updateCheckedIds(objs[i]);")
.append("}")
.append("}")
.append("}}");
}

sb.append("</script>");

if(type!=null&&type.equals("checkbox")){
//添加checkBox标签
sb.append("<input type='checkbox' onclick='checkAll(this)'/>");
}

// 获取所有提交的参数(包括查询条件参数)
Enumeration enumeration = request.getParameterNames();
String name = "";
String checkedIds = "";
boolean flag=false;
while (enumeration.hasMoreElements()) {
name = (String) enumeration.nextElement();
checkedIds = request.getParameter(name);//获取参数的值
if(CHECKED_IDS.equals(name)){
flag=true;
break;
}
continue;
}
if(id==null||"".equals(id.trim())){
id=CHECKED_IDS;//不设置id时,默认值
}
//添加隐藏域
sb.append("<input type='hidden' name='checkedIds' id='").append(id).append("'");
if(flag){
sb.append("value='").append(checkedIds).append("'/>");
}else{
sb.append("value=''/>");
}
out.println(sb.toString());
}
}


2.配置.tld文件

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE taglib PUBLIC "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.1//EN"
"http://java.sun.com/j2ee/dtds/web-jsptaglibrary_1_1.dtd">
<taglib>
<tlib-version>1.0</tlib-version>
<jsp-version>1.1</jsp-version>
<short-name>ck</short-name>
<uri>http://www.talkweb.tag.cn/checkBox</uri>
<tag>
<name>checkBox</name>
<tag-class>com.talkweb.ecm.core.tags.checkbox.CheckBoxTag</tag-class>
<body-content>scriptless</body-content>
<attribute>
<name>value</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uncheckIfMsg</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>disabledIf</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>style</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>checkedDisabledIf</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>onclick</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>

</tag>
<tag>
<name>checkedValues</name>
<tag-class>com.talkweb.ecm.core.tags.checkbox.CheckedValues</tag-class>
<body-content>scriptless</body-content>
<attribute>
<name>id</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>type</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
</tag>
</taglib>


3.jsp中引入自定义标签

   <%@ taglib prefix="ck" uri="http://www.talkweb.tag.cn/checkBox" %>

     <ck:checkedValues>代替隐藏域<input type='hidden'>

<!-- 隐藏域:存入选择的复选框value,多个以","分隔
当添加type="checkbox"时为复选框,支持全选、取消全选操作
-->
<ck:checkedValues id="ids"/>


   <ck:checkBox>标签代替原来的复选框<input type='checkbox'>

<td align="center">
<!-- 传入复选框的value值
unCheckIfMsg  “不能勾选”的条件
"||" 表示“或”
-->
<ck:checkBox value="${scene.id}"
uncheckIfMsg="${isDaiBan}:您选择的标准文本处于发布待办中,不能进行解除绑定的操作!||${iterationCount>0}:您选择的标准文本处于迭代中,不能进行解除绑定的操作!||${pubingCount>0}:您选择的标准文本处于发布中,不能进行解除绑定的操作!" />
</td>


最后还需要在action类中声明checkedIds属性,并添加get,set方法,如下:

/**
* 复选框跨页多选的value值,多个以","分隔
*/
private String checkedIds;//跨页多选时,所选的id

public String getCheckedIds() {
return checkedIds;
}

public void setCheckedIds(String checkedIds) {
this.checkedIds = checkedIds;
}




内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息