Finalmente após 10 horas de trabalho consegui fazer minha primeira atividade, utilizando Ajax. E como este é um problema que a maioria dos programadores que desenvolvem para a Web costumam enfrentar, resolvi postar a solução encontrada.
1ª Importe o arquivo js do Prototype , responsável em implementar as funções do Ajax.
<script type="text/javascript" src="${prototypeJsURL}"></script>
2ª Neste trecho construiremos a parte principal da função Ajax.
<script type="text/javascript">
function ajaxRequest() {
// Aqui você deve informar a sua Logic
var url = 'modelo.prepareListaEstado.ajax.logic';
// Recuperando o indice do campo select
var dropdownIndex = document.getElementById('cbPais').selectedIndex;
// Recuperando o ID do Pais que foi selecionado no campo <select>
var idPais = document.getElementById('cbEstacao')[dropdownIndex].value;
// Passando o ID como parâmetro
var pars = 'idPais='+idPais;
// Corpo do meu método Ájax
var myAjax = new Ajax.Request(url,
{
method: 'get',
parameters: pars,
onComplete: showResponse
}
);
}
// Este método é chamado após a sua Logic, ser executada.
function showResponse(data){
var jsonObject = eval('(' + data.responseText + ')');
// Recupera a Lista de estados
var estados = jsonObject.listaEstado;
// Recupera o seu campo select que será preenchido
var campoSelect = document.getElementById("cbEstadoResultado");
// Variável que armazenará os options do seu campo select
var select = "";
// Com este for você preencherá a variável que corresponde ao
// seu campo select
for(i=0;i<estados.length;i++) {
select += "<option value = " + estados[i].idEstado + "> " + estados[i].nome + "</option>";
}
// Aqui você preenche o seu campo select com , os valores do estado
campoSelect.innerHTML = select;
}
</script>
// Para que você possa utilizar, os scripts acima a sua página deve estar da seguinte maneira.
<select id="cbPais" name="idPais" onchange="javascript:ajaxRequest();">
<option value="0">Selecione</option>
<option value="1">Brasil</option>
<option value="2">Japão</option>
<option value="3">China</option>
</select>
<select id="cbEstado" name="idEstado">
</select>
As informações aqui postadas complementam as informações do site do vRaptor.
5 comentários:
amigo blz? poderia me enviar um exemplo de conexao access usando ODBC usando jsp e struts? se n for problema pra vc.. tipo uma tela de login, passando do login basta abrir uma outra pagina e so. abraços
amigo blz? poderia me enviar um exemplo de conexao access usando ODBC usando jsp e struts? se n for problema pra vc.. tipo uma tela de login, passando do login basta abrir uma outra pagina e so. abraços
meu email: njuniorba@yahoo.com.br
È isso vitão....
então to precisando uma tela q use ejb 3.0 e faça login vc teria como fazer e me mandar?
hahahahh
Amigo blz? Não conseguir entender algumas variáveis:
"cbEstadoResultado" e 'cbEstacao'
Grato pela ajuda e parabéns pelo post.
Postar um comentário