Olá desenvolvedores, na parte 4 deste tutorial sobre combos dependentes de “Estados” e “Cidades”, implementaremos um evento Ajax que será disparado no lado do servidor quando a opção do Estado for selecionada. Este evento irá recuperar o código do Estado selecionado.

Antes, porém, iremos implementar uma melhoria no h:selectOneMenu, veja que quando a tela é aberta o combo já exibe selecionado o Estado “Acre”. Dessa forma se o usuário desejasse selecionar o Acre, ele teria que selecionar outro Estado qualquer e depois selecionar novamente o Estado desejado, o Acre, para que o evento fosse disparado. Totalmente contra produtivo.

O componente responsável pela exibição da lista dos Estados é o f:selectItems, dessa forma acima dele, incluiremos o f:selectItem com a mensagem “selecione”. E por se tratar de uma opção que não poderá disparar o evento no caso de ser selecionada, ela receberá a propriedade “noSelectionOption”.

Por padrão o valor do “noSelectionOption” é false, neste caso a tornaremos então verdadeira. Ele indica que a opção selecionada representa a opção especial “sem seleção”. Isto é, que não pode ser selecionada.

<f:selectItem itemLabel=”--[Selecione]--" noSelectionOption=”true” />

Outro importante acréscimo ao código é colocar no componente h:selectOneMenu a propriedade “immediate” que impedirá um eventual bloqueio por alguma validação que tenha sido feita no código.

<h:selectOneMenu value= “#{pessoaBean.pessoa.estados}” immedaite=“true” />

Ainda nos resta mais um adendo, no método responsável pelo carregamento de todos os estados, no IDaoPessoaImpl. No forEch iremos fazer com que ao invés de carregar o objeto inteiro, seja carregado apenas o identificador “id”.

Obtendo o “id” do “Estado”, poderemos montar um “select” onde as cidades possuem o “id” correspondente ao Estado selecionado.

Se você “logar” no sistema e der um “inspecionar elemento” na página, poderá observar os Estados sendo listados, tendo como valor números inteiros positivos.

AJAX

Agora precisamos disparar um método do lado do servidor e assim capturar o código do Estado. Um importante detalhe é que está ação não deve fazer com que toda a tela seja recarregada.

Os passos são, selecionar o Estado, ir para o lado do Servidor e então carregar o combo de cidades. Este processo será feito por Ajax. O evento a ser disparado é o “change” que executará o combo dos “Estados”, enviando o valor selecionado para o lado do servidor. E então o método carregacidades() será executado pelo “listener”.

MÉTODO CARREGARCIDADES()

No ManagedBean PessoaBean, implementaremos o método carregacidades(). Entretanto, por padrão do JSF – JavaServer Faces, o método que estiver sendo chamado pelo “listener” deverá receber um objeto do tipo “AjaxBehaviorEvent” por parâmetro.

public void carregaCidades(AjaxBehaviorEvent event){}

Por hora no escopo do método iremos imprimir no console o código obtido correspondente ao Estado selecionado. Assim, a partir do objeto “event” iremos obter o componente que disparou o evento, e então retornaremos o valor de um argumento específico do elemento, e por fim o “id”.

Sabemos então que a opção “–[Selecione]—” retorna um “null”, assim podemos tratar para apenas processar a consulta ao banco de dados quando o objeto selecionado for diferente de “null”. E faremos isso transformando o dado obtido em uma “String”. E depois implementando uma condição para a consulta.

EM POUCAS PALAVRAS

Neste tutorial implementamos o método que nos permite obter o “id” do Estado selecionado. Tendo o “id”, o que precisaremos fazer é consultar na base de dados o Estado que corresponde ao identificador, e listar em um combo dependente as cidades que correspondentes.