在向表单添加其他副本时保留<div>表单数据


到表单。

我正在开发SpringMVC Webapp。我有一个由动态形式组成的视图。表单的动态元素如下所示:

现在,当前的场景是:

我将变量${worksiteCount}从控制器传递给视图(存储在我的portlet会话中—默认为1)。

表单提交由一个在后台处理表单数据的@ActionMapping组成。
我在我的页面上有另一个按钮,允许用户在必要时添加额外的工程网站-额外的工作地点#1等)。

点击触发一个@RequestMapping,它更新"worksiteCount"并返回带有附加表单字段的视图。

问题是:我在表单中填写的任何数据都会在点击此请求时被删除。

如何在会话中持久化这些数据?例如,我应该使用Ajax脚本(最好使用DOJO/Vanilla JS)在jsp端异步地增加变量{worksiteCount}吗?

如果是,如何在不刷新视图的情况下完成?
我是Ajax-Dojo(如dojo.xhrGet/post)、Spring框架的初学者。请帮助。

<c:if test="${worksiteCount>1}">
            <c:set var="i" value="0"/>
            <c:forEach var="worksiteAddresses" items="${worksiteAddresses}"> 
            <c:set var="i" value="${i+1}"/>
                <c:if test="${worksiteCount>1}">
                <div class="row">
                <h2 id="worksiteAddress${i}" name="worksiteAddress${i}">Additional Worksite<span>${i}</span></h2>
                </div>
                </c:if>
             <div class="row">
                <div id="f-addr1" class="field">
                    <label>Address1<span><tag:requiredIcon/> </span></label>
                    <input class="" type="text" value="${worksiteAddresses.companyAddressLine1}" id="addressLine1${i}" name="addressLine1${i}" onblur="validateControl('addressLine1${i}');"/>
                </div>
                <div id="f-addr2" class="field">
                    <label>Address2</label>
                    <input class="" type="text" value="${worksiteAddresses.companyAddressLine2}" id="addressLine2${i}" name="addressLine2${i}" />
                </div>              
                <br class="clear" />
            </div>
            <div class="row">
                <div id="f-city" class="field">
                    <label>City<span><tag:requiredIcon/> </span></label>
                    <input class="" type="text" name="city${i}" id="city${i}" value="${worksiteAddresses.companyCity}" onblur="validateControl('city${i}');" />
                </div>
                <div id="f-zip" class="field">
                    <label>Zip<span><tag:requiredIcon/> </span></label>
                    <input class="" type="text" name="zip${i}" id="zip${i}" value="${worksiteAddresses.Zipcode}" onblur="validateZipControl('zip${i}',${i});" />
                </div>
                <br class="clear" />
            </div>
            </c:forEach>
        </c:if>

如果我正确理解了这一点,并且点击页面上的按钮的唯一效果是使用附加工作站点的新字段更新表单,有几种方法可以处理该问题。最简单的可能是:

1)有字段已经在页面上,但隐藏和使用JS使他们可见。这样就保留了现有的表单数据。

如果一些数据需要使用现有数据从服务器端提取,并且在某种程度上改变了表单上已经存在的数据的性质,那么这真的是一个提交,应该由控制器处理。

2)您可以返回所有修改过的原始数据,但是也可以使用新字段,或者使用AJAX仅获取与答案#1相结合的新数据。

最新更新