[JSF] Enviar requisição com Ajax

Referência: The Java EE 6 Tutorial Sending an Ajax Request.

Como prometido no post anterior Usando Ajax com JSF vou continuar nos estudos do The Java EE 6 Tutorial, agora mostrando como enviar requisições com Ajax.

O Java EE 6 Tutorial mostra quatro formas para enviar requisições Ajax, são elas:

Usando o atributo event da tag f:ajax

O atributo event define que evento d o DOM irá disparar a ação ajax. Alguns valores possíveis são click, keyup, mouseover, focus e blur.

Se um valor não for especificado para este atributo, ele irá assumir o evento default do componente pai da tag f:ajax correspondente.

Componentes ActionSource, como commandButton, commandLink e inputText tem o valor do atributo action como alvo de seus eventos default.

Exemplo:

<h:commandButton id="submit" value="Submit"> 
    <f:ajax event="click" />
</h:commandButton>
<h:outputText id="result" value="#{userNumberBean.response}" />

Note que estes eventos JSF, apesar de serem baseados em JavaScript, são diferentes dos eventos do DOM que possuem o prefixo "on".

Usando o atributo execute da tag f:ajax

Define o componente ou componentes que serão executados no servidor. O componente é identificado pelo seu atributo id e você pode especificar mais de um componente executável, separando-os com um espaço em branco.

Ao ser executado, o componente participa de todas as fases do ciclo de vida da requisição, exceto da fase Render Response.

O valor do atributo execute também pode ser uma palavra chave como @all, @none, @this e @form, explicados no post anterior Usando Ajax com JSF, referindo-se ao componente com que a tag f:ajax está aninhada.

A seguir, um exemplo mostrando como especificar que um inputText de id userNo seja executado no click de um commandButton de forma assíncrona:

<h:inputText id="userNo" 
             title="Type a number from 0 to 10:"
             value="#{userNumberBean.userNumber}">
    ...
</h:inputText>
<h:commandButton id="submit" value="Submit"> 
    <f:ajax event="click" execute="userNo" />
</h:commandButton>

Usando o atributo immediate

Se seu valor estiver configurado para true, seus eventos serão propagados durante a fase Apply Request Values. O valor default é false. Conheça o ciclo de vida JSF para complementar entendimentos.

Usando o atributo listener

Utilizado para referenciar um método do lado do servidor a ser executado por uma ação Ajax do lado do cliente. No seguinte exemplo o atributo listener da tag f:ajax chama um método em um bean quando o evento correspondente é disparado, observe:

<f:ajax listener="#{mybean.someaction}" render="somecomponent" />

Beleza?!

Agora você já pode sofisticar as interações com usuário em sua camada de apresentação JSF.

No próximo post vamos falar de CDI. Até lá!