这是我在jsp页面中的表单的一部分,我想在按下“添加字段”按钮时重复:
<div style="font-weight:bold">Choose Form Fields:</div>
<table id="tbl-formfields" class="table vertical-align table-condensed" >
<thead>
<tr>
<th width="10%">Display Order</th>
<th width="33%">Field</th>
<th width="33%">Input Type</th>
<th width="12%">Make Required</th>
<th width="12%">Action</th>
</tr>
</thead>
<tbody id="tbody">
<tr id="tr-formField">
<td>
<form:select path="formOptionDisplayOrder" name="formOptionDisplayOrder" id="formOptionDisplayOrder">
<c:forEach begin="0" end="9" step="1" varStatus="loop">
<form:option value="${loop.count}"><c:out value="${loop.count}"/></form:option>
</c:forEach>
</form:select>
</td>
<td>
<form:select path="formFieldName" name="formFieldName" id="formFieldName">
<option value="">-------------------------------------</option>
<c:forEach var="ff" items="${formFields}">
<form:option value="${ff.formFieldId}">${ff.formFieldName}</form:option>
</c:forEach>
</form:select>
</td>
<td>
<div>
<span>
<form:select path="formOptionType" name="formOptionType" id="formOptionType">
<form:option value="">-------------------------------------</form:option>
<c:forEach var="ot" items="${optTypes}">
<c:set var="optValue" value="${fn:split(ot,' ')}"/>
<form:option value="${fn:toLowerCase(optValue[0])}">${ot}</form:option>
</c:forEach>
</form:select>
</span>
</div>
<div id="block-optionsInput" style="display:none">
<label>Options:</label><br>
<form:input path="fieldOptions" id="options" type="text" name="fieldOptions" data-role="tagsinput" value=""/><!-- value="Male,Female"/>-->
</div>
</td>
<td>
<label><form:checkbox path="fieldRequired" name="fieldRequired" value="true"/> Required</label>
</td>
<td></td>
</tr>
</tbody>
</table>
<div>
<button type="button" id="btn-addfield" class="btn btn-primary">
<span class="glyphicon glyphicon-plus"></span> Add Field
</button>
</div>
重复此字段的javascript / jQuery代码是:
//****Repeat form field block****
var repeatBlock = "#tbody";
var repeatText = '<td>\n\
<form:select path="formOptionDisplayOrder" name="formOptionDisplayOrder" id="formOptionDisplayOrder">\n\
<c:forEach begin="0" end="9" step="1" varStatus="loop">\n\
<form:option value="${loop.count}"><c:out value="${loop.count}"/></form:option>\n\
</c:forEach>\n\
</form:select>\n\
</td>\n\
<td>\n\
<form:select path="formFieldName" name="formFieldName">\n\
<form:option value="">-------------------------------------</form:option>\n\
<c:forEach var="ff" items="${formFields}">\n\
<form:option value="${ff.formFieldId}">${ff.formFieldName}</form:option>\n\
</c:forEach>\n\
</form:select></td>\n\
<td>\n\
<form:select path="formOptionType" class="optType" name="formOptionType">\n\
<form:option value="">-------------------------------------</form:option>\n\
<c:forEach var="ot" items="${optTypes}">\n\
<c:set var="optValue" value="${fn:split(ot,' ')}"/>\n\
<form:option value="${fn:toLowerCase(optValue[0])}">${ot}</form:option>\n\
</c:forEach>\n\
</form:select>\n\
<div class="optBlock" style="display:none">\n\
<label>Options:</label><br>\n\
<form:input path= "fieldOptions" class="optInput" type="text" name="fieldOptions" data-role="tagsinput" value=""/>\n\
</div>\n\
</td>\n\
<td><label><form:checkbox path="fieldRequired" name="fieldRequired" value="true"/> Required</label></td>\n\
<td><a href="javascript:void(0)" class="removeField" style="color:red" title="Remove this field">\n\
<span class="glyphicon glyphicon-remove"></span></a>\n\
</td></tr>';
$("#btn-addfield").click(function (e) {
e.preventDefault();
$(repeatBlock).append('<tr class="trRepeat">' + repeatText);
});
$(repeatBlock).on('click', '.removeField', function (e) {
e.preventDefault();
$(this).parent().parent().remove();
});
当我在javascript部分添加Spring表单块时,出现以下错误:
Neither BindingResult nor plain target object for bean name 'formOptionDisplayOrder' available as request attribute
如果我在js部分使用简单的HTML表单块,页面加载正常,但后续重复字段中的数据不会发送到控制器。是不是添加了Spring表单块?是否有解决方法?
此外,是否可以将对象的可重复属性声明为数组/列表并循环控制器上的字段总数并设置值?
提前致谢。