JSF2,Ajax部分更新和ui重复 - 提交和更新动态添加的文本框

时间:2011-11-10 09:23:47

标签: html ajax jsf-2 validation

我有一个JSF2应用程序和一个包含以下代码的页面:

<h:inputText id="someInput" required="true" />

<p:outputPanel id="itemsPanel">
    <ui:repeat var="i" value="#{myBean.itemIndices}" id="items">
        <h:inputText 
            id="itemInput" 
            value="#{myBean.dataItems[i]}" 
            />
        <h:panelGroup 
            layout="block" 
            styleClass="clear" 
            rendered="#{((i+1) % 10 == 0)}" 
            />
    </ui:repeat>
</p:outputPanel>
<br/>
<p:commandButton
    classStyle="btn" 
    value="Add Row"
    actionListener="#{myBean.increaseItemsCount}" 
    update="itemsPanel" 
    immediate="false"
    ajax="true"
    />

ui:repeat根据itemIndicesdataItems属性动态呈现数字文本框。 “添加行”按钮调用的方法会动态增加itemIndicesdataItems的数量,因此会显示其他文本输入。

如果文本框someInput中没有值,则当前代码将不起作用,因为AJAX请求也验证表单并且验证失败。在这种情况下按下按钮没有视觉效果,甚至没有验证未通过的用户反馈(因为我仅更新itemsPanel)。

如果我将按钮更改为immediate="true",则验证问题不再存在。不幸的是,我希望能够在添加新行之前恢复用户可能已更改的动态输入字段的值。 immediate="true"属性导致表单无法提交给服务器,因此用户输入的数据将不会保留。

可能的解决方案是将process="all dynamic input ids csv"属性添加到命令按钮,并将immediate属性设置回true。这将导致服务器仅验证process属性中指定的输入,并且它们将被持久化。这里的问题是这些输入ID是由JSF动态生成的,我无法想出一种将它们作为CSV格式化的正确方法。我也不喜欢在myBean中动态生成id的解决方案,它依赖于JSF如何输出它们的假设。

非常感谢所有建议。

1 个答案:

答案 0 :(得分:2)

您可以使用process="itemsPanel"

<p:commandButton
    classStyle="btn" 
    value="Add Row"
    actionListener="#{myBean.increaseItemsCount}" 
    process="itemsPanel" 
    update="itemsPanel" 
    ajax="true"
    />

您只应将命令按钮移动到<h:outputPanel id="itemsPanel">