Discussoes de Programacao e Tecnologia

Desejo fazer um filtro para Pais-->Estado-->Cidade-->Bairro. Alguém pode me dar uma idéia?

11 respostas
R
rafapilao

:?: Bom dia sou iniciante na programação web em java, estou fazendo um sistema usando JSF e JSP, um hotel simples, só que estou com um problema, desejo fazer um filtro de Pais–>Estado–>Cidade–>Bairro. Como posso fazer?

Alura Desenvolvimento Front-End React Do primeiro componente à liderança técnica! HTML/CSS/JavaScript fundamental, React com hooks e...

11 Respostas

R
RobsonFagundes

rafapilao
ta mais qual eh sua dificuldade ???
eh em logica??? vc nao sabe fazer uma logica para isso
ou é qual componetes JSF vc poderia usar pra seu filtro ???

R
rafapilao

Primeiramente é a lógica e não sei os componentes que posso usar. :? :frowning:

R
rafapilao

Primeiramente é a lógica e não sei os componentes que posso usar.

RobsonFagundes:
rafapilao
ta mais qual eh sua dificuldade ???
eh em logica??? vc nao sabe fazer uma logica para isso
ou é qual componetes JSF vc poderia usar pra seu filtro ???

R
RobsonFagundes

Intaum Primeiramente estude Orientacao a Objetos


t+

M
marcelbonnet

rafapilao: vc pode usar o framework DWR . Procura o link no google. Ele é um framework bem simples que é acionado via javascript para devolver respostas com AJAX através da interação com classes java. É legal.
Você coloca um combo (html do tipo SELECT) contendo os Estados, por exemplo. Ao selecionar um Estado ele chama uma função javascript que chama o framework DWR. Ele ativará uma classe que vc deve criar e configurar no dwr.xml . Essa classe retorna pra tua página um java.util.Map contendo a lista de cidades e ainda atualiza a combo de cidades automaticamente.

Vou te passar um exemplo que fiz rapidinho pra te ajudar. Tenta implemtar. Usei o Eclipse Europa, criei um projeto ExemploDWR :

[list]baixe o arquivo dwr.jar e coloque ele dentro de Web Content\WEB-INF\lib (espero que não tenhamos problemas com versões, aqui. baixei o meu jar faz um ano e não procurei uma atualização.)[/list]
[list]Configure os arquivos abaixo do jeito que te passar. [/list]

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
  <display-name>ExemploDWR</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  
  
  	  <!-- DWR -->
  <servlet>
    <servlet-name>dwr-invoker</servlet-name>
    <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
    <init-param>
      <param-name>debug</param-name>
      <param-value>true</param-value>
    </init-param>
  </servlet>
  <servlet-mapping>
    <servlet-name>dwr-invoker</servlet-name>
    <url-pattern>/dwr/*</url-pattern>
  </servlet-mapping>
  
</web-app>

dwr.xml coloque isso dentro do WEB-INF , junto do web.xml :

<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr//dwr20.dtd">

<dwr>
	<allow>
		<create creator="new" javascript="Cidade"><!-- javascript=[nome] este é o nome 
		que será usado pra chamar os métodos da classe via javascript -->
			<param name="class" value="exemplo.dwr.Cidade" />
		</create>
	</allow>
</dwr>

Crie a classe Cidade.java . Faça o mesmo pacote que criei pra não ter que alterar no dwr.xml

package exemplo.dwr;

import java.util.LinkedHashMap;
import java.util.Map;
/**
 * Esta classe é acionada por um javascript do framework DWR
 * @author marcelbonnet
 *
 */
public class Cidade {

	/**
	 * lista de cidades
	 */
	private Map<Integer, String> cidades;
	
	/**
	 * Lista as cidades de uma Unidade Federativa
	 * @param uf inteiro que representa o código de uma UF
	 * @return a lista de cidades daquele Estado (UF)
	 */
	public Map<Integer, String> listarCidades(int uf){
		cidades = new LinkedHashMap<Integer, String>();
		//acesso a uma base de dados:
		//if uf = 123 ... sql busca cidades do estado 123... e por aí vai
		//teste:
		if(uf == 1){
			cidades.put(1, "Curitiba");
			cidades.put(2, "Maringá");
			cidades.put(3, "Cascavel");
		}
		if(uf == 2){
			cidades.put(3, "São Paulo");
			cidades.put(4, "Presidente Prudente");
		}
		
		return cidades;
	}
}

E por fim, faça tua JSP : index.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!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">

<!-- 
ATENAÇÃO COM ESSES SCRIPTS: ELES DEVEM SER USADOS DESSE JEITO. APENAS LEMBRE QUE O PRIMEIRO
DEVE SER O NOME REGISTRADO NO [DWR.XML].JS :
 -->

<script type='text/javascript'
	src='${pageContext.request.contextPath}/dwr/interface/Cidade.js'></script>
	<!-- OS PRÓXIMOS SCRIPTS SÃO IMPORTADOS COM OS NOMES A SEGUIR SEMPRE: -->
<script type='text/javascript'
	src='${pageContext.request.contextPath}/dwr/engine.js'></script>
<script type='text/javascript'
	src='${pageContext.request.contextPath}/dwr/util.js'></script>
	
<script type="text/javascript">

/**
@param combo deve ser passado o nome do combo para o DWR, e não o objeto em si.
**/
function dwrCidade(id, combo){
	DWRUtil.removeAllOptions(combo);//limpa os itens do combo (<select>)
	/*
	* MUITO CUIDADO AQUI:
	Cidade.[método] porque eu registrei no dwr.xml uma classe
	com o identificador "Cidade". É assim que aquela classe será referenciada
	no javascript. A seguir vc chama um método implementado.
	Consulte a documentação do DWR para saber mais sobre isso. eu não manjo tanto.
	*/	
	Cidade.listarCidades(id, function(mapa){
		DWRUtil.addOptions(combo, mapa);
	});
}

</script>

</head>
<body>
<table>
	<tr>
		<td>Estado</td>
		<td colspan="3">
			<select id="cmbEstado" onchange="dwrCidade(this.value,'cmbCidade');">
				<option value="1">Paraná</option>
				<option value="2">São Paulo</option>
			</select>
		</td>
	</tr>
	<tr>
		<td>Cidades</td>
		<td colspan="3">
			<select id="cmbCidade">
				<option value="0">Selecione a cidade</option>
			</select>
		</td>
	</tr>
</table>

</body>
</html>

Olha, eu testei e funcionou. Espero que vc consiga se virar agora. Não esqueça de nos responder dizendo qual tua impressão, ok?

Abraço.

R
rafapilao

Agradeço a ajuda farei isso, irei no google. Abraço.

marcelbonnet:
rafapilao: vc pode usar o framework DWR . Procura o link no google. Ele é um framework bem simples que é acionado via javascript para devolver respostas com AJAX através da interação com classes java. É legal. Você coloca um combo (html do tipo SELECT) contendo os Estados, por exemplo. Ao selecionar um Estado ele chama uma função javascript que chama o framework DWR. Ele ativará uma classe que vc deve criar e configurar no dwr.xml . Essa classe retorna pra tua página um java.util.Map contendo a lista de cidades e ainda atualiza a combo de cidades automaticamente.

Vou te passar um exemplo que fiz rapidinho pra te ajudar. Tenta implemtar. Usei o Eclipse Europa, criei um projeto ExemploDWR :

[list]baixe o arquivo dwr.jar e coloque ele dentro de Web Content\WEB-INF\lib (espero que não tenhamos problemas com versões, aqui. baixei o meu jar faz um ano e não procurei uma atualização.)[/list]
[list]Configure os arquivos abaixo do jeito que te passar. [/list]

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
  <display-name>ExemploDWR</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  
  
  	  <!-- DWR -->
  <servlet>
    <servlet-name>dwr-invoker</servlet-name>
    <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
    <init-param>
      <param-name>debug</param-name>
      <param-value>true</param-value>
    </init-param>
  </servlet>
  <servlet-mapping>
    <servlet-name>dwr-invoker</servlet-name>
    <url-pattern>/dwr/*</url-pattern>
  </servlet-mapping>
  
</web-app>

dwr.xml coloque isso dentro do WEB-INF , junto do web.xml :

<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://getahead.org/dwr//dwr20.dtd">

<dwr>
	<allow>
		<create creator="new" javascript="Cidade"><!-- javascript=[nome] este é o nome 
		que será usado pra chamar os métodos da classe via javascript -->
			<param name="class" value="exemplo.dwr.Cidade" />
		</create>
	</allow>
</dwr>

Crie a classe Cidade.java . Faça o mesmo pacote que criei pra não ter que alterar no dwr.xml

package exemplo.dwr;

import java.util.LinkedHashMap;
import java.util.Map;
/**
 * Esta classe é acionada por um javascript do framework DWR
 * @author marcelbonnet
 *
 */
public class Cidade {

	/**
	 * lista de cidades
	 */
	private Map<Integer, String> cidades;
	
	/**
	 * Lista as cidades de uma Unidade Federativa
	 * @param uf inteiro que representa o código de uma UF
	 * @return a lista de cidades daquele Estado (UF)
	 */
	public Map<Integer, String> listarCidades(int uf){
		cidades = new LinkedHashMap<Integer, String>();
		//acesso a uma base de dados:
		//if uf = 123 ... sql busca cidades do estado 123... e por aí vai
		//teste:
		if(uf == 1){
			cidades.put(1, "Curitiba");
			cidades.put(2, "Maringá");
			cidades.put(3, "Cascavel");
		}
		if(uf == 2){
			cidades.put(3, "São Paulo");
			cidades.put(4, "Presidente Prudente");
		}
		
		return cidades;
	}
}

E por fim, faça tua JSP : index.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!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">

<!-- 
ATENAÇÃO COM ESSES SCRIPTS: ELES DEVEM SER USADOS DESSE JEITO. APENAS LEMBRE QUE O PRIMEIRO
DEVE SER O NOME REGISTRADO NO [DWR.XML].JS :
 -->

<script type='text/javascript'
	src='${pageContext.request.contextPath}/dwr/interface/Cidade.js'></script>
	<!-- OS PRÓXIMOS SCRIPTS SÃO IMPORTADOS COM OS NOMES A SEGUIR SEMPRE: -->
<script type='text/javascript'
	src='${pageContext.request.contextPath}/dwr/engine.js'></script>
<script type='text/javascript'
	src='${pageContext.request.contextPath}/dwr/util.js'></script>
	
<script type="text/javascript">

/**
@param combo deve ser passado o nome do combo para o DWR, e não o objeto em si.
**/
function dwrCidade(id, combo){
	DWRUtil.removeAllOptions(combo);//limpa os itens do combo (<select>)
	/*
	* MUITO CUIDADO AQUI:
	Cidade.[método] porque eu registrei no dwr.xml uma classe
	com o identificador "Cidade". É assim que aquela classe será referenciada
	no javascript. A seguir vc chama um método implementado.
	Consulte a documentação do DWR para saber mais sobre isso. eu não manjo tanto.
	*/	
	Cidade.listarCidades(id, function(mapa){
		DWRUtil.addOptions(combo, mapa);
	});
}

</script>

</head>
<body>
<table>
	<tr>
		<td>Estado</td>
		<td colspan="3">
			<select id="cmbEstado" onchange="dwrCidade(this.value,'cmbCidade');">
				<option value="1">Paraná</option>
				<option value="2">São Paulo</option>
			</select>
		</td>
	</tr>
	<tr>
		<td>Cidades</td>
		<td colspan="3">
			<select id="cmbCidade">
				<option value="0">Selecione a cidade</option>
			</select>
		</td>
	</tr>
</table>

</body>
</html>

Olha, eu testei e funcionou. Espero que vc consiga se virar agora. Não esqueça de nos responder dizendo qual tua impressão, ok?

Abraço.

R
rafapilao

Pode deixar irei fazer isso e responderei logo.

M
marcelbonnet

Cara, contanto que vc saiba o mínimo de Java e Java Web tipo, como criar um projeto web num eclipse da vida, tiver idéia do que seja JSP, vc conseguirá entender. Os detalhes do DWR é que eu não conheço bem, mas isso aí é tranquilo e quebra muito galho pra gente, sem contar que incorpora ajax de uma forma simples. Vc pode depois incrementar com taglibs… ou trocar tudo por JSF, mas aí a curva de tempo aprendizado só aumenta e as dificuldades também!

R
rafapilao
M
marcelbonnet

Ótimo. Boa sorte com o teu projeto!
Abraço.

R
rafapilao

marcelbonnet:
Ótimo. Boa sorte com o teu projeto!
Abraço.

Criado 3 de outubro de 2008
Ultima resposta 10 de out. de 2008
Respostas 11
Participantes 3

Topicos relacionados

XMLHttpResponse e XMLHttpRequest 5 respostas Erro 403.7 Forbbiden - NF-e ... urgente! 22 respostas Re:Filtrar cidades em JSF 2.0 8 respostas JSF - size da lista [RESOLVIDO] 4 respostas Projetos em WAR ou EAR? 9 respostas
Alura Git Flow: entenda o que é, como e quando utilizar Entenda o que é Git Flow, como funciona seu fluxo com branches como Master, Develop, Feature, Release e Hotfix, além de vantagens e desvantagens.
Casa do Codigo Desmistificando WebAssembly: Alta performance,... Por Raphael Amorim — Casa do Codigo