Grailsでは、フィールドの隣に検証エラーメッセージを表示する方法を教えてください。

Question

Grails 2.0.4 documentationは、ページの上部にエラーメッセージを表示する方法と、フィールドが無効な場合に要素にcssクラスを追加する方法を示しますが、エラーメッセージの横に表示する方法は教えていませんフィールド自身、このような何か：

 ----------------------- 
Name: |      | You must enter a name! 
     ----------------------- 

どのように無効なフィールドのための特定のエラーメッセージを取得しないと、それがためだフィールドの横にそれを表示しますか？

Answer 1

実際には、ドキュメントがこれを行う方法を示してい、それだけで、これは彼らが何を意味するかであることを過度に明確ではありません。

<g:renderErrors bean="${book}" as="list" field="title"/> 

あなたはフィールド属性を指定した場合、それだけでエラーをレンダリングしますそのフィールドのための（s）だから、それに応じてHTMLを書くのはあなた次第です。

<input type="text" ... /> <g:if test="${bean.hasErrors}"><g:renderErrors bean="${book}" as="list" field="title"/></g:if> 

それはあなたがそれを希望として単純またはように複雑得ることができると私は一般のGrailsプラグインを好む一方で、これはただ一つせずに行うのに十分簡単なようで、あなたはマークアップをより詳細に制御できます。

Answer 2

私はこれを行うにはGrails Fields pluginを使用しています。

フォームフィールドレンダリング用のデフォルトテンプレートを簡単に作成できます。たとえば、私はgrails-app/views/_fields/default/_field.gspに次があります。

<%@ page defaultCodec="html" %> 
<div class="control-group${invalid ? ' error' : ''}"> 
    <label class="control-label" for="${property}${index ?: ""}">${label}</label> 
    <div class="controls"> 
     <%= widget.replace("id=\"${property}\"", "id=\"${property}${index ?: ""}\"") %> 
     <g:if test="${invalid}"><span class="help-inline">${errors.join('<br>')}</span></g:if> 
    </div> 
</div> 

にエラーがインラインで表示されているHTMLから見ることができるように。ここに私のログインフォームの一部です：

<g:form controller="home" action="login" > 
    <f:field bean="user" property="email"/> 
    <f:field bean="user" property="password"> 
     <g:field type="password" name="${property}" value="${value}"/> 
    </f:field> 
</g:form> 

Answer 3

私はJquery validation plugin一緒に行くことをお勧めします。これについていくつかのGrailsプラグインがありますが、時代遅れです。また、この作業は他のプラグインを使用するのには非常に簡単だと思います。

Answer 4

ここでは、コンテキストのラップアラウンドユーザー名フィールドにカスタムエラーがあります。これはあなたが望むことをするでしょう。

<dt>User Id</dt> 
      <dd><g:textField name="username" value="${user?.username}"/> 
      <g:hasErrors bean="${user}" field="username"> 
        <g:eachError bean="${user}" field="username"> 
         <p style="color: red;"><g:message error="${it}"/></p> 
        </g:eachError> 
       </g:hasErrors> 
      </dd>