JSF:如何刷新ajax请求中的必填字段

时间:2011-01-11 14:50:18

标签: ajax jsf richfaces

好的,这是你的核心问题。

页面。我有两个必需的“输入文本”。 一个命令按钮,用于更改bean值并重新更新“作业”对象。

<a4j:form id="pervForm">  
    SURNAME:<h:inputText id="surname" label="Surname" value="#{prevManager.surname}" required="true" />  
    <br/>               
    JOB:<h:inputText  value="#{prevManager.job}"  id="job"  maxlength="10" size="10"  label="#{msg.common_label_job}" required="true" />  
    <br/>  

    <a4j:commandButton value="Set job to Programmer" ajaxSingle="true" reRender="job">  
        <a4j:actionparam name="jVal" value="Programmer" assignTo="#{prevManager.job}"/>  
    </a4j:commandButton>  

    <h:commandButton id="save" value="save"  action="save" class="HATSBUTTON"/>  

</a4j:form>  

这里是简单的经理:

public class PrevManager   
{  

    private String surname;  
    private String job;  

    public String getSurname()  
    {  
        return surname;  
    }  

    public void setSurname(String surname)  
    {  
        this.surname = surname;  
    }  

    public String getJob()  
    {  
        return job;  
    }  

    public void setJob(String job)  
    {  
        this.job = job;  
    }  

    public String save()  
    {  
        //do something  
    }  

}  

我们这样做:

在作业输入文本上写一些内容(例如“老师”)。 留空姓。 保存。 出现验证错误(姓氏是强制性的)。 按“将作业设置为程序员”:没有任何反应。

检查bean值,我发现它已正确更新,确实页面上的组件没有更新!

嗯,根据我发现的JBoss Docs:

  

Ajax区域是一个关键的ajax组件。   它限制了组件的一部分   要在服务器上处理的树   当ajax请求到来时。   处理意味着在调用期间   解码,验证和模型更新   相。最常见的原因是使用   地区是:

     

- 在此过程中避免中止JSF生命周期处理   验证其他表格输入   对于给定的ajax请求是不必要的;    - 在交付事件时定义不同的策略   (立即= “真/假”)    - 显示ajax状态的单个指示器    - 提高渲染处理的性能   (selfRendered = “真/假”,   renderRegionOnly =“true / false”)

     

以下两个例子显示了   验证错误的情况   不允许处理ajax输入。   输入名称。 outputText   组件应该在你之后重新出现。   但是,在第一种情况下,这个   活动将因中止而中止   另一个字段是required =“true”。   您将只看到错误消息   而“作业”字段为空。

以下是您的示例:

<ui:composition xmlns="http://www.w3.org/1999/xhtml"  
      xmlns:ui="http://java.sun.com/jsf/facelets"  
      xmlns:h="http://java.sun.com/jsf/html"  
      xmlns:f="http://java.sun.com/jsf/core"  
      xmlns:a4j="http://richfaces.org/a4j"  
      xmlns:rich="http://richfaces.org/rich">  

        <style>  
            .outergridvalidationcolumn {  
                padding: 0px 30px 10px 0px;  
            }  
        </style>  

    <a4j:outputPanel ajaxRendered="true">  
        <h:messages style="color:red" />  
    </a4j:outputPanel>  
    <h:panelGrid columns="2" columnClasses="outergridvalidationcolumn">  

        <h:form id="form1">  
                <h:panelGrid columns="2">  
                    <h:outputText value="Name" />  
                    <h:inputText value="#{userBean.name}">  
                        <a4j:support event="onkeyup" reRender="outname" />  
                    </h:inputText>  
                    <h:outputText value="Job" />  
                    <h:inputText  required="true" id="job2" value="#{userBean.job}" />  
                </h:panelGrid>  
        </h:form>  

        <h:form id="form2">  
            <h:panelGrid columns="2">  
                <h:outputText value="Name" />  
                <a4j:region>  
                    <h:inputText value="#{userBean.name}">  
                        <a4j:support event="onkeyup" reRender="outname" />  
                    </h:inputText>  
                </a4j:region>  
                <h:outputText value="Job" />  
                <h:inputText   required="true"  id="job1"  value="#{userBean.job}" />  
            </h:panelGrid>  
        </h:form>  

    </h:panelGrid>  
    <h:outputText id="outname" style="font-weight:bold" value="Typed Name: #{userBean.name}" />  
    <br />  
</ui:composition>  

Form1:行为不正确。我需要填写工作,然后填写姓名。 Form2:行为是正确的。我不需要填写工作来查看正确的值。

不幸的是,使用Ajax区域并没有帮助(实际上我使用它的方式很糟糕......)因为我的字段都是必需的。这是主要的不同。

有什么想法吗?

非常感谢。

3 个答案:

答案 0 :(得分:3)

此问题也在JSF 2中确定,并在相关答案中详细解释:How can I populate a text field using PrimeFaces AJAX after validation errors occur?

总结一下,答案是你需要清除EditableValueHolder组件的状态,当它即将被ajax渲染时,但是它不包含在ajax-execute中,通过调用方法{{ 3}},setValue(null)setSubmittedValue(null)setLocalValueSet(false)。注意:在JSF 2中,您将使用便捷方法setValid(true)代替。

鉴于您的“作业”输入字段具有客户端ID prevForm:job,以下是如何在与“将作业设置为程序员”按钮关联的动作侦听器方法中清除它:

UIInput input = (UIInput) context.getViewRoot().findComponent("prevForm:job");
input.setValue(null);
input.setSubmittedValue(null);
input.setLocalValueSet(false);
input.setValid(true);

答案 1 :(得分:0)

使用a4j:actionparam将设置值,但在这种情况下无法帮助您绕过验证。验证发生在组件上(而不是bean属性)。因此,当您提交时,组件值仍为空。希望这可以帮助。

答案 2 :(得分:0)

当您单击“将作业设置为程序员”时,没有任何反应,因为您没有重新调整消息组件。如果这样做,您将能够看到验证消息。

您需要重新发送消息,因为它是<a4j:commandButton/>,而不是简单的<h:commandButton/>

尝试使用道具。 “将作业设置为程序员”按钮中的immediate并检查它是否会更新该字段。

<a4j:commandButton value="Set job to Programmer" ajaxSingle="true" reRender="job" immediate="true">
    <a4j:actionparam name="jVal" value="Programmer" assignTo="#{prevManager.job}"/>  
</a4j:commandButton>

*我不认为这里需要“ajaxSingle”..

也许你可以得到一个新问题..使用immediate,bean值不会更新(MAYBE!)。如果发生这种情况,请创建一个bean方法,手动设置bean值。

否则,如果bean值已更新且字段仍为空,请尝试将“job”字段放入<a4j:outputPanel/>并将reRender放入outputPanel。

<a4j:outputPanel id="myPanel">
   <h:inputText  value="#{prevManager.job}"  id="job"  maxlength="10" size="10"  label="#{msg.common_label_job}" required="true" />
</a4j:outputPanel/>

<a4j:commandButton value="Set job to Programmer" reRender="myPanel" immediate="true">
    <a4j:actionparam name="jVal" value="Programmer" assignTo="#{prevManager.job}"/>  
</a4j:commandButton>

有关<a4j:outputPanel/> here的更多信息。