Preciso de ajuda para fazer um esquema que faça o seguinte:
A partir de 1 SELECT com o nome de alguns paises, ao ser selecionado 1 pais ele cria outro select com os estados relacionados a este pais;
e a partir do select com os estados ele cria um outro com as cidades, bairros, logradouros e ETC;
o codigo que fiz ai embaixo ele faz só o primeiro passo, porem, do segundo passo em diante ele “exclui” os outros selects e dexa somente 1 com as informacoes necessarias.
segue abaixo o codigo.
Obrigado
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script type="text/javascript">
function showHint(str)
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("div1").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","Selecionador.jsp?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form action="" method="get">
<p>País:
<select name ="Paises" id="pais" onchange="showHint(this.value);" onclick="adicionarOpcoesSelect();">
<option value="vazio">Selecionar
<option value="Brasil">Brasil
<option value="Argentina">Argentina
<option value="EUA">EUA
<option value="Africa">Africa
</select>
<p> Cidades:
<select name ="Cidades" id="cidade" onchange="showHint(this.value);" onclick="adicionarOpcoesSelect();">
<option value="vazio"> Selecione </option>
</select>
<p> Estados:
<select name ="Estados" id="estados" onchange="showHint(this.value);" onclick="adicionarOpcoesSelect();">
<option value="vazio"> Selecione </option>
</select>
<p> Bairros:
<select name ="Bairros" id="bairros" onchange="showHint(this.value);" onclick="adicionarOpcoesSelect();">
<option value="vazio"> Selecione </option>
</select>
<p> Logradouros:
<select name ="Logradouros" id="logradouros" onchange="showHint(this.value);" onclick="adicionarOpcoesSelect();">
<option value="vazio"> Selecione </option>
</select>
</form>
<div id="div1">
</div>
</body>
</html>
JSP:
<%@ page import="java.sql.*"%>
<%@ page import="java.io.*"%>
<%@ page import="java.util.ArrayList"%>
<%@ page import="Negocio.NegocioPais"%>
<%@ page import="Negocio.NegocioCidade"%>
<%@ page import="Negocio.NegocioBairro"%>
<%@ page import="Negocio.NegocioLogradouro"%>
<%@ page import="Negocio.NegocioLogradouroBairro"%>
<%@ page import="entidade.Pais"%>
<%@ page import="entidade.Cidade"%>
<%@ page import="entidade.Bairro"%>
<%@ page import="entidade.Logradouro"%>
<%@ page import="entidade.LogradouroBairro"%>
<%
//NegocioPais negocioPais = new NegocioPais();
//ArrayList<Pais> paises = negocioPais.Consulta();
String q = request.getParameter("q");
int flag = 0;
int flagBairro = 0;
int flagLogradouro = 0;
ArrayList<String> vetCidades = new ArrayList<String>();
ArrayList<String> vetBairros = new ArrayList<String>();
ArrayList<String> vetLogradouros = new ArrayList<String>();
if(q.equals("Brasil") || flag == 1){
flag = 1;
NegocioCidade negocioCidade = new NegocioCidade();
ArrayList<Cidade> cidades = negocioCidade.Consulta("SELECT * FROM cidade where codPais = 1");
String str;
if(cidades != null){
for (int i = 0; i<cidades.size(); i++){
Cidade cidade = (Cidade) cidades.get(i);
str = "<option value='"+cidade.getNome().toString()+"'>"+cidade.getNome().toString();
vetCidades.add(str);
}
}
}
if(q.equals("Sao Paulo") || flagBairro == 1){
flagBairro = 1;
NegocioBairro negocioBairro = new NegocioBairro();
ArrayList<Bairro> bairros = negocioBairro.Consulta("SELECT * FROM bairro where codCidade = 1");
for (int i = 0; i<bairros.size(); i++){
Bairro bairro = (Bairro) bairros.get(i);
vetBairros.add(bairro.getNome());
}
}
%>
<%if (flag != 0) {%>
<p>Cidades:
<select name =Cidades id="cidade" onchange="showHint(this.value);">
<option value="vazio"> Selecione </option>
<%for(int j = 0; j < vetCidades.size(); j++) {
out.println(vetCidades.get(j));
}%>
</select>
<%} %>
<% if (flagBairro != 0){ %>
<p>Bairros:
<select name =Bairros id="bairro" onchange="showHint(this.value);">
<option value="vazio"> Selecione </option>
<%for(int j = 0; j < vetBairros.size(); j++) {
out.println(vetBairros.get(j));
}%>
</select>
<%}%>