2

ページの下部に、必須の検証済みフォームフィールドを含むお問い合わせフォームがあります。検証に失敗した場合、スクロール位置をページの下部に戻すにはどうすればよいですか？

このページをJavascriptを無効にして動作させたいので、AJAXソリューションはありません。私はこのようなものを持っています：

<a id="contact"></a>
<h:form id="cform">
    <h5>Contact!</h5>

    <h:outputLabel for="name">Name: 
        <h:message id="nameMsg"  for="name" />
    </h:outputLabel>

    <h:inputText id="name" value="#{bean.name}" required="true" requiredMessage="Please enter name!" />

    <h:outputLabel for="email">Email: 
        <h:message id="emailMsg" for="email" />
    </h:outputLabel>

    <h:inputText id="email" value="#{bean.email}" required="true" requiredMessage="Email is required!">
        <f:validator validatorId="myValidator" />
    </h:inputText>

    <h:outputLabel for="comment">Comment: 
        <h:message id="commentMsg" for="comment" />
    </h:outputLabel>

    <h:inputTextarea id="comment" value="#{bean.comment}" required="true" requiredMessage="Please enter a comment!"/>

    <h:commandButton action="#{bean.go}" id="send" value="send" />
</h:form>

Bean側で検証を行い、適切なアンカーに手動でリダイレクトすることを考えましたが、そもそもJSFを使用するという目的に反しているようです。これを行う簡単な方法があると思いますが、おそらく質問を正しく表現していないため、解決策をグーグルで検索するのに問題があります。誰？

4

3 に答える 3

4

<f:event type="postValidate">検証フェーズの直後にリスナーフックを設定するために使用できます。FacesContext#isValidationFailed()検証が失敗したかどうかを確認するために使用できます。フェイスメッセージをリダイレクト後も存続させるために使用できますFlash#setKeepMessages()（つまり、デフォルトでリクエストスコープになっています！）。ExternalContext#redirect()非アクションメソッドでリダイレクトを実行するために使用できます。

したがって、要約すると、これは次のようになります。

<h:form id="cform">
    ...
    <f:event type="postValidate" listener="#{bean.postValidate}" />
</h:form>

と：

public void postValidate() throws IOException {
    FacesContext context = FacesContext.getCurrentInstance();

    if (context.isValidationFailed()) {
        context.getExternalContext().getFlash().setKeepMessages(true);
        context.getExternalContext().redirect("contact.xhtml#cform");
    }
}
于 2012-09-12T11:01:54.007 に答える
1

または、エラーの場合は、 f：ajax onerror =を使用して何かを行うことができます：

 <p:commandButton **>
  <f:ajax onerror="window.scrollTo(0, 0);" />
 </p:commandButton>
于 2013-11-20T09:44:31.387 に答える
0

このために明示的なアンカータグは必要ありません。フォームのIDで十分です。

フォームアクションUrlの最後にFacesにIDをレンダリングさせることができます。

例えば。

...メインページのコンテンツはここに表示されます...。

<form id="contact-form" action="/MyView.jsf#contact-form" method="post">

これにより、送信後にブラウザがフォームにスクロールします。

URLにも表示されます。

これを行うには、おそらくカスタムフォームレンダラーを実装できます。

于 2013-11-26T14:40:48.260 に答える