使用springside-form tag的步骤

springside4的form标签解决了Spring tag和bootstrap样式不兼容的问题,见 SpringSide4 Wiki说明

(1)首先将org.springside.modules.web.taglib下面的3个类加到工程
BSAbstractMultiCheckedElementTag.java
BSCheckboxesTag.java
BSRadioButtonsTag.java

(2)然后将springside-form.tld放到WEB-INF下

(3)接着将JSP中的

<%@taglib prefix="sf" uri="http://www.springframework.org/tags/form" %>  
改成
<%@ taglib prefix="sf" uri="http://www.springside.org.cn/tags/form" %>

最后把
<sf:checkboxes path="roles" items="${roleList }" itemValue="id" itemLabel="name"/>
改成
<sf:bscheckboxes path="roles" items="${roleList }" itemValue="id" itemLabel="name"/>

最后来看看springside4为我们做了什么
之前页面生成的HTML:
<div class="control-group">
	<label class="control-label" for="roles">角色:</label>
	<div class="controls">
		<span><input id="roles1" name="roles" type="checkbox" value="1"/><label for="roles1">ADMIN</label></span>
		<span><input id="roles2" name="roles" type="checkbox" value="2"/><label for="roles2">EDITOR</label></span>
		<input type="hidden" name="_roles" value="on"/>
	</div>
</div>
           

使用springside-form tag的步骤

改成SpringSide4以后生成的HTML:

<div class="control-group">
	<label class="control-label" for="roles">角色:</label>
	<div class="controls">
		<label for="roles1" class="checkbox"><input id="roles1" name="roles" type="checkbox" value="1"/>ADMIN</label>
		<label for="roles2" class="checkbox"><input id="roles2" name="roles" type="checkbox" value="2"/>EDITOR</label>
		<input type="hidden" name="_roles" value="on"/>

	</div>
</div>

  使用springside-form tag的步骤


SpringSide对于源代码修改的地方
之前:            
org.springframework.web.servlet.tags.form.AbstractMultiCheckedElementTag            
private void writeElementTag(TagWriter tagWriter, Object item, Object value, Object label, int itemIndex)
			throws JspException {

		tagWriter.startTag(getElement());
		if (itemIndex > 0) {
			Object resolvedDelimiter = evaluate("delimiter", getDelimiter());
			if (resolvedDelimiter != null) {
				tagWriter.appendValue(resolvedDelimiter.toString());
			}
		}
		tagWriter.startTag("input");
		String id = resolveId();
		writeOptionalAttribute(tagWriter, "id", id);
		writeOptionalAttribute(tagWriter, "name", getName());
		writeOptionalAttributes(tagWriter);
		tagWriter.writeAttribute("type", getInputType());
		renderFromValue(item, value, tagWriter);
		tagWriter.endTag();
		tagWriter.startTag("label");
		tagWriter.writeAttribute("for", id);
		tagWriter.appendValue(convertToDisplayString(label));
		tagWriter.endTag();
		tagWriter.endTag();
	}

    
之后

org.springside.modules.web.taglib.BSAbstractMultiCheckedElementTag  


private void writeElementTag(TagWriter tagWriter, Object item, Object value, Object label, int itemIndex)
		throws JspException {
	String id = resolveId();

	//在用户自定义的cssClass前面加上inputType做为class
	//以前是<label class="labelCssClass">,现在变成<label class="checkbox labelCssClass">
	String resolvedLabelClass = getInputType();
	if (labelCssClass != null) {
		resolvedLabelClass += " " + labelCssClass;
	}

	//start tag从<span>改成<label>
	tagWriter.startTag("label");
	tagWriter.writeAttribute("for", id);

	tagWriter.writeAttribute("class", resolvedLabelClass);

	if (itemIndex > 0) {
		Object resolvedDelimiter = evaluate("delimiter", getDelimiter());
		if (resolvedDelimiter != null) {
			tagWriter.appendValue(resolvedDelimiter.toString());
		}
	}
	
	//input tag从label前面移到了后面
	tagWriter.startTag("input");

	writeOptionalAttribute(tagWriter, "id", id);
	writeOptionalAttribute(tagWriter, "name", getName());
	writeOptionalAttributes(tagWriter);
	tagWriter.writeAttribute("type", getInputType());
	renderFromValue(item, value, tagWriter);
	tagWriter.endTag();

	tagWriter.appendValue(convertToDisplayString(label));
	tagWriter.endTag();
}


总结变化:

 (1)Spring中的checkbox tag有个element属性,默认为span,生成的checkbox和label整个被<span>包裹住
<span><input id="roles1" name="roles" type="checkbox" value="1"/><label for="roles1">ADMIN</label> 

    而SpringSide4(bootstrap)是直接用label包住input.
<label for="roles1" class="checkbox"><input id="roles1" name="roles" type="checkbox" value="1"/>ADMIN</label> 
  
    
    (2)SpringSide4(bootstrap)的label有个class属性,值为getInputType(),即checkbox或radio

    

你可能感兴趣的:(bootstrap,springside4)