Jsf 2 JSF在提交后重置表单_Jsf 2

Jsf 2 JSF在提交后重置表单

jsf-2

Jsf 2 JSF在提交后重置表单,jsf-2,Jsf 2,我的jsf表单有一个小问题。我举了一个注册的例子带有提交按钮和重置按钮的表单： <?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1

我的jsf表单有一个小问题。我举了一个注册的例子带有提交按钮和重置按钮的表单：

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:f="http://java.sun.com/jsf/core" 
  xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
    <title>Register</title>
</h:head>

<h:body>

    <ui:composition template="/templates/master.xhtml" >

        <ui:define name="content">

            <center>
                <h:outputText value="New User Registration" />
            </center>

            <h:form>

                <h:panelGrid columns="3">

                    <h:outputText value="Username:" />
                    <h:inputText id="username" value="#{registerService.userName}" required="true" requiredMessage="Please Enter Username!" />
                    <h:message for="username" style="color:red" />

                    <h:outputText value="Password:" />
                    <h:inputSecret id="password" value="#{registerService.password}" required="true" requiredMessage="Please Enter Password!" />
                    <h:message for="password" style="color:red" />  

                    <h:outputText value="Confirm Password:" />
                    <h:inputSecret id="confirmPassword" value="#{registerService.confirmPassword}" required="true" requiredMessage="Please Confirm Password!" />
                    <h:message for="confirmPassword" style="color:red" />   

                    <h:outputText value="Lastname:" />
                    <h:inputText id="lastname" value="#{registerService.lastName}" required="true" requiredMessage="Please Enter Lastname!" />
                    <h:message for="lastname" style="color:red" />

                    <h:outputText value="Firstname:" />
                    <h:inputText id="firstname" value="#{registerService.firstName}" required="true" requiredMessage="Please Enter Firstname!" />
                    <h:message for="firstname" style="color:red" />

                    <h:outputText value="Date of Birth" />
                    <h:panelGrid columns="3">

                        <h:selectOneMenu value="#{registerService.dayOfBirth}">
                            <f:selectItems value="#{registerService.days}" />
                        </h:selectOneMenu>

                        <h:selectOneMenu value="#{registerService.monthOfBirth}">
                            <f:selectItems value="#{registerService.months}" />
                        </h:selectOneMenu>

                        <h:selectOneMenu value="#{registerService.yearOfBirth}">
                            <f:selectItems value="#{registerService.years}" />
                        </h:selectOneMenu>

                    </h:panelGrid>
                    <h:outputText value="" />

                    <h:outputText value="E-Mail:" />
                    <h:inputText id="email" value="#{registerService.eMail}" required="true" requiredMessage="Please Enter E-Mail!" />
                    <h:message for="email" style="color:red" /> 

                    <h:outputText value="Confirm E-Mail:" />
                    <h:inputText id="confirmEmail" value="#{registerService.confirmEMail}" required="true" requiredMessage="Please Confirm E-Mail!" />
                    <h:message for="confirmEmail" style="color:red" />  

                    <h:outputText value="Country:" />
                    <h:inputText id="country" value="#{registerService.country}" required="true" requiredMessage="Please Enter Country!" />
                    <h:message for="country" style="color:red" />

                    <h:outputText value="Region:" />
                    <h:inputText id="region" value="#{registerService.region}" required="true" requiredMessage="Please Enter Region!" />
                    <h:message for="region" style="color:red" />

                    <h:outputText value="Town:" />
                    <h:inputText id="town" value="#{registerService.town}" required="true" requiredMessage="Please Enter Town!" />
                    <h:message for="town" style="color:red" />

                    <h:outputText value="ZIP-Code:" />
                    <h:inputText id="zipCode" value="#{registerService.zipCode}" required="true" requiredMessage="Please Enter ZIP-Code!" />
                    <h:message for="zipCode" style="color:red" />   

                </h:panelGrid>

                <h:commandButton type="submit" value="Submit" action="#{registerService.addUser}" >
                    <f:ajax execute="@form" render="@form" />
                </h:commandButton>            
                <h:commandButton type="reset" value="Reset" />

            </h:form>

        </ui:define>

    </ui:composition>

</h:body>


登记

当我输入内容并按下重置按钮时，所有内容都重置（为空）再一次。然而，当我只是键入用户名，例如，并按下提交我的错误消息正在出现（必需消息），如果我现在按下复位按钮，任何东西都不会复位。一切都一样

我希望我的重置按钮在任何状态下都能工作。如何才能做到这一点？

由

生成的HTML

元素不会清除表单的输入值。相反，它将表单的输入值重置为初始值，就像它们在最初获得的HTML源代码中一样。当您执行
render=“@form”
时，您基本上会更新整个表单的HTML源代码，所有这些输入字段现在都将包含HTML源代码中提交的值。作为重置按钮“工作正常”的证据，请在按下重置按钮之前再次尝试编辑提交的值
您基本上有两种选择：

不要使用
render=“@form”
。仅显式呈现这些消息。例如

<h:message id="m_username" for="username" ... /> <h:message id="m_password" for="password" ... /> ... <f:ajax ... render="m_username m_password ..." />

...
如果你有很多的话，那么把它们全部指定出来只需要做大量的工作。如果你用的是PrimeFaces，可能会被解救

<h:message for="username" styleClass="message" /> <h:message for="password" styleClass="message" /> ... <p:ajax ... update="@(.message)" />

...

通过“获取”按钮刷新页面

<h:button value="Reset" />

你说“不行”到底是什么意思？您是否删除了
execute=“@form”
之类的内容？请在开发人员的视角而不是最终用户的视角中详细说明“不起作用”。不，我没有删除execute。当表单填写正确后，我调用registerService.addUser what返回“index.html”返回我的主页。它与execute=“@form”render=“@form”一起工作，但当我只呈现我的所有消息时，它不会工作。您的问题是由其他地方引起的。我想做一些类似于您的#2的事情，但我不想使用按钮，因为我在弹出对话框中有一个窗体，如果用户点击取消，它会重置主窗体（不是取消按钮所在的窗体）. 有没有一种方法可以实现JS或JSF EL重置按钮功能，而无需实际使用按钮并单击它？