Come posso cambiare il colore di un messaggio di errore nel framework a strisce

Question

Sto tentando di cambiare il colore del messaggio di errore. Sto usando una convalida Stripes. Se la validazione fallisce, sto inviando un messaggio di errore. Lo volevo in colore rosso.Ma si vede in colore nero. Come posso cambiare il colore del messaggio di errore nel framework Stripes.

In seguito è quello che ho provato.

 <div class="item"> 

      <stripes:errors /> 
      <stripes:form name="home"action="/home.action"> 
       //contents 
       </stripes:form> 
     </div> 

Answer 1

Utilizzo di selettori per specificare le classi di errore. Questo applicare uno stile errore globale per campi di input,

input.error, textarea.error { 
    color: red; 
    background-color: yellow; 
} 

input.error[type="radio"], input.error[type="checkbox"], select.error { 
    background-color: white; 
    border: 2px solid red; 
} 

Leggere il Stripes Manual per ulteriori informazioni.

Answer 2

Come dice Vinoth, è possibile applicare le classi CSS per modificare l'aspetto dei messaggi di errore. Inoltre, i messaggi Stripes possono essere completamente personalizzati modificando StripesResources.properties.

Qui puoi definire esattamente come saranno i tuoi messaggi, utilizzando markup e classi CSS, o anche stili in linea.

# Resource strings used by the <stripes:errors> tag when there are no nested tags 
stripes.errors.header=<div class="my-error-wrapper"><h4>Ooops... some things went awfully awry:/h4><ol> 
stripes.errors.beforeError=<li><i class="fa fa-warning"></i>&nbsp; 
stripes.errors.afterError=</li> 
stripes.errors.footer=</ol></div> 

# Resource strings used by the <stripes:errors> tag when displaying errors for a 
# specific field (e.g. <stripes:errors field="password"/>). If not supplied the 
# values above will be used instead. 
stripes.fieldErrors.header= 
stripes.fieldErrors.beforeError=<span class="my-error-inline"><i class="fa fa-warning"></i>&nbsp; 
stripes.fieldErrors.afterError=</span> 
stripes.fieldErrors.footer= 

# Resource strings used by the stripes:messages tag 
stripes.messages.header=<div class="my-message-wrapper"><ul> 
stripes.messages.beforeMessage=<li> 
stripes.messages.afterMessage=</li> 
stripes.messages.footer=</ul></div> 

Come si può vedere è possibile aggiungere materiale extra di fantasia come FontAwesome icone (ammesse, questo va un po 'oltre OP chiede).