Tags JSF HTML

h:graphicImage

Renderiza uma imagem. A Listagem 12 apresenta um exemplo de utilização da mesma e sua respectiva renderização em código HTML;

<h:graphicImage value="https://imd.ufrn.br/portal/assets/images/UFRN_LOGO-01.svg"/>

Renderiza:

<img src="https://imd.ufrn.br/portal/assets/images/UFRN_LOGO-01.svg"/>

h:commandButton

Renderiza um botão (input com type= “text”). A Listagem 13 apresenta um exemplo de utilização da mesma e sua respectiva renderização em código HTML;

<h:commandButton value="Click aqui!" onclick="alert('Bem-vindo ao IMD!');" />

Renderiza:

<input type="submit" value="Click aqui!" onclick="alert('Bem-vindo ao IMD!');" />

h:commandLink

Renderiza um link. A Listagem 14 apresenta um exemplo de utilização da mesma e sua respectiva renderização em código HTML;

<h:commandLink value="Página 1" action="pagina1" />

Renderiza:

<a href="#">Página 1</a>

h:message

Renderiza uma mensagem para um componente na página JSF. Utilizada, por exemplo, para as mensagens de validações de campos em formulários. A Listagem 15 apresenta um exemplo de utilização da mesma e sua respectiva renderização em código HTML;

<h:inputText id="nomeUsuario" size="20" label="nomeUsuario" required="true" />

<h:message for="nomeUsuario" style="color:red" />

Renderiza (em caso de validação):

<span style="color:red">nomeUsuario: Validation Error: Value is required</span>

h:messages

Renderiza mensagens para todos os componentes na página JSF. Também utilizada para mensagens de validações em formulários. A Listagem 16 apresenta um exemplo de utilização da mesma e sua respectiva renderização em código HTML;

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

Renderiza:

<ul style="color:red;margin:8px;">

    <li> nomeUsuario: Validation Error: 

        Length is greater than allowable maximum of '20' </li>

    <li> senha: Validation Error: 

        Length is less than allowable minimum of '5' </li> 

</ul>

f:convertDateTime

Realiza a conversão de uma data e hora para um formato definido. Utilizada para facilitar a leitura das datas pelos usuários. A Listagem 17 apresenta um exemplo de utilização da mesma e sua respectiva renderização em código HTML;

<h:outputText value="#{item.data}"> 

<f:convertDateTime pattern="dd/MM/yyyy HH:mm"/>

</h:outputText>

Renderiza: 17/10/2014

f:validateLength

Realiza a validação de uma quantidade de caracteres especificada. Utilizada, por exemplo, para validar o tamanho mínimo de caracteres de um campo em um formulário. A Listagem 18 apresenta um exemplo de utilização da mesma;

<h:inputSecret value="#{usuarioMBean.senha}">

<f:validateLength minimum="8" maximum="16" />

</h:inputSecret>

f:selectItem

Especifica um item para as tags de botão de opção, caixa de combinação, etc. A Listagem 19 apresenta um exemplo de utilização da mesma;

<h:selectOneMenu value="#{usuarioMBean.estado}"> 

<f:selectItem itemValue="1" itemLabel="RN" />

<f:selectItem itemValue="2" itemLabel="PB" /> 

</h:selectOneMenu>

f:selectItems

Especifica um conjunto de itens para as tags de botão de opção, caixa de combinação, etc. A Listagem 20 apresenta um exemplo de utilização da mesma;

<h:selectOneMenu value="#{usuarioMBean.estado}" >

<f:selectItems value="#{estadosMBean.estados}" var="uf" 

itemLabel="#{uf.nome}" itemValue="#{uf.id}" /> 

</h:selectOneMenu>