JSF - h: mensagens

A tag h: messages mostra todas as mensagens em um local correspondente aos elementos da IU.

Tag JSF

<h:messages style = "color:red;margin:8px;" />

Saída renderizada

Caso: o nome de usuário inserido tem mais de 20 caracteres e a senha inserida tem menos de 5 caracteres.

<ul style = "color:red;margin:8px;"> 
   <li> UserName: Validation Error:  
      Length is greater than allowable maximum of '20' </li> 
   <li> Password: Validation Error:  
      Length is less than allowable minimum of '5' </li> 
</ul>

Atributos de tag

S.No	Atributo e descrição
1	id Identificador para um componente
2	binding Referência ao componente que pode ser usado em um backing bean
3	rendered Um booleano; falso suprime a renderização
4	styleClass Nome da classe da folha de estilo em cascata (CSS)
5	for O ID do componente cuja mensagem é exibida, aplicável apenas a h: mensagem
6	errorClass Classe CSS aplicada a mensagens de erro
7	errorStyle Estilo CSS aplicado a mensagens de erro
8	fatalClass Classe CSS aplicada a mensagens fatais
9	fatalStyle Estilo CSS aplicado a mensagens fatais
10	globalOnly Instrução para exibir apenas mensagens globais, aplicável apenas a mensagens h:. Padrão: falso
11	infoClass Classe CSS aplicada a mensagens de informação
12	infoStyle Estilo CSS aplicado a mensagens de informação
13	layout Especificação para layout de mensagem: tabela ou lista, aplicável apenas a h: mensagens
14	showDetail Um booleano que determina se os detalhes da mensagem são mostrados. Os padrões são falsos para h: messages, true para h: message
15	showSummary Um booleano que determina se os resumos das mensagens são mostrados. Os padrões são verdadeiros para h: messages, false para h: message
16	tooltip Um booleano que determina se os detalhes da mensagem são renderizados em uma dica de ferramenta; a dica de ferramenta só é renderizada se showDetail e showSummary forem verdadeiros
17	warnClass Classe CSS para mensagens de aviso
18	warnStyle Estilo CSS para mensagens de aviso
19	style Informação de estilo inline
20	title Um título, usado para acessibilidade, que descreve um elemento. Navegadores visuais normalmente criam dicas de ferramentas para o valor do título

Aplicação de exemplo

Vamos criar um aplicativo JSF de teste para testar a tag acima.

Degrau	Descrição
1	Crie um projeto com o nome helloworld sob um pacote com.tutorialspoint.test conforme explicado no capítulo JSF - Primeira Aplicação .
2	Modifique home.xhtml conforme explicado abaixo. Mantenha o resto dos arquivos inalterados.
3	Compile e execute o aplicativo para ter certeza de que a lógica de negócios está funcionando de acordo com os requisitos.
4	Por fim, construa o aplicativo na forma de um arquivo war e implante-o no Apache Tomcat Webserver.
5	Inicie seu aplicativo da web usando o URL apropriado, conforme explicado abaixo na última etapa.

home.xhtml

<!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"> 
   <head> 
      <title>JSF Tutorial!</title> 
   </head>
   
   <body> 
      <h2>h:messages example</h2> 
      <hr /> 
      
      <h:form> 
         <h:panelGrid id = "panel" columns = "2" border = "0" cellpadding = "10"  
         cellspacing = "1">   
            <h:outputLabel value = "Enter Username" /> 
            
            <h:inputText  id = "username"  size = "20" label = "UserName"  
               required = "true"> 
               <f:validateLength for = "username" minimum = "5" maximum = "20" />    
            </h:inputText>         
            <h:outputLabel value = "Enter Password" /> 
            
            <h:inputSecret id = "password" size = "20" label = "Password"  
               required = "true" redisplay = "true" > 
               <f:validateLength for = "password" minimum = "5" maximum = "10" />  
            </h:inputSecret>         
            <h:commandButton id = "submit" value = "Submit" action = "result"/> 
         </h:panelGrid> 
         <h:messages style = "color:red;margin:8px;" /> 
      </h:form> 
   
   </body> 
</html>

Assim que você estiver pronto com todas as mudanças feitas, vamos compilar e rodar a aplicação como fizemos no capítulo JSF - Primeira Aplicação. Se tudo estiver bem com sua aplicação, isso produzirá o seguinte resultado:

↰ Previous page