一、下拉框实现增加,保存在字段domain中以,号分割。并将值回现在jsp中选中展示
效果:
1)
<script type="text/javascript">
$(function() {
$('#userProjectRecommendedForm1').form({
url : '${ctxweb }/userinfo/attestation/userProjectRecommendedSave',
onSubmit : function() {
return $(this).form('validate');
},
success : function(data) {
var result = $.parseJSON(data);
var id = result.msg;
if (result.success == true) {
location.href = "${ctxweb}/userinfo/userProjectRecommendedFull/" + id;
}
}
});
$(".add-field").click(function(e){
e.preventDefault();
var n=$(".add-type>li").length;
var num=n+1;
var li="<li>"+
" <select name='domain' id='domain'> "+
" <option value=''>请选择</option> "+
<c:forEach items='${domains}' var='domain'>
" <option value='${domain.text}' <c:if test='${domain.text eq douser["+num+"]}'>selected</c:if>> ${domain.text} </option> "+
</c:forEach>
" </select > "+
" </li>";
$(".add-type").append(li);
});
$(".common").on("click","input",function(){
if($(this).is(":checked")){
$(this).parent().css("background","url('"+'${ctxStatic }'+"/images/checked_07.png') no-repeat left center");
}else{
$(this).parent().css("background","url('"+'${ctxStatic}'+"/images/no-check_07.png') no-repeat left center");
}
});
});
</script>
2)
<li>
<label for="">领域</label>
<div>
<p>(至少选择一项,可多选择)</p>
<ul class="add-type common clear">
<li>
<c:set value="${fn:split(userProjectRecommended.domain,',') }" var="douser" />
<c:choose>
<c:when test="${not empty douser }">
<c:forEach items="${douser }" var="duser" varStatus="i">
<li>
<select name="domain" id="domain">
<option value="">请选择</option>
<c:forEach items="${domains}" var="domain">
<option value="${domain.text}" <c:if test="${domain.text eq duser}">selected</c:if>>
${domain.text}
</option>
</c:forEach>
</select>
<c:if test="${i.index==0 }"><a href="#" class="add-field"><img src="${ctxStatic}/images/add_icon_07.png" alt="" /></a></c:if>
</li>
</c:forEach>
</c:when>
<c:otherwise>
<select name="domain" id="domain">
<option value="">请选择</option>
<c:forEach items="${domains}" var="domain">
<option value="${domain.text}">
${domain.text}
</option>
</c:forEach>
</select>
<a href="#" class="add-field"><img src="${ctxStatic}/images/add_icon_07.png" alt="" /></a>
</c:otherwise>
</c:choose>
</li>
</ul>
</div>
</li>
3)
public class Dictionarytype implements java.io.Serializable{
private Long id;
private String code;
private String name;
private Integer seq;
private String description;
private String pid;
}
public class Dictionary implements java.io.Serializable{
private Long id;
private String code;
private String text;
private Long dictionarytypeId;
private String dictionarytypeName;
private Integer seq;
private Integer state; // 状态 0启用 1停用
private Integer isdefault; // 是否默认
}
后台代码:
Dictionarytype domain = dictionarytypeServiceI.getByCode("follow_domain"); // 关注领域
List<Dictionary> domains = dictionaryService.findDicList(domain.getId());
model.addAttribute("domains", domains);
二、复选框多选,以及值回显:
<li>
<label for="">地域</label>
<div>
<p>(至少选择一项,可多选择)</p>
<ul class="round-times common clear">
<c:set value="${fn:split(userProjectRecommended.territoryKey,',') }" var="ter" />
<c:forEach var="area" items="${areas}" varStatus="i">
<li
<c:choose>
<c:when test="${fn:indexOf(userProjectRecommended.territoryKey, area.text)>=0}">
style="background: url('${ctxStatic}/images/checked_07.png') left center no-repeat;"
</c:when>
<c:otherwise>
style="background: url('${ctxStatic}/images/no-check_07.png') left center no-repeat;"
</c:otherwise>
</c:choose>
>
<input type="checkbox" name="territoryKey" value="${area.text}"
<c:if test="${fn:indexOf(userProjectRecommended.territoryKey, area.text)>=0}"> checked='checked'</c:if>
/>
<label>${area.text} </label>
</li>
</c:forEach>
</ul>
</div>
</li>
后台代码:
Dictionarytype area = dictionarytypeServiceI.getByCode("territory_key"); // 地域
List<Dictionary> areas = dictionaryService.findDicList(area.getId());
model.addAttribute("areas", areas);
三、<textarea></ textarea>标签使用注意问题: