Discussoes de Programacao e Tecnologia

Seleção de objeto dentro do formulário

1 resposta
manjubex
manjubex

Galera, estou desenvolvendo um projeto de uma locadora de veiculos para a faculdade e estou com dificuldade em uma parte.

Eu tenho uma página (cadastrarLocacao.jsp) onde eu tenho que informar o código do cliente e o código do veiculo para poder registrar a locação, porém eu estou querendo que ao invés do usuário digitar direto o código do cliente e veiculo, ele pudesse fazer uma pesquisa e selecionar esse cliente direto do formulário (por uma popup por exemplo). Alguém sabe como eu posso fazer isso?

Página de criação

<!--Importando as taglibs-->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<html>
<head>
<!--Definindo estilo CSS-->
<link type="text/css" href="css/formulario.css" rel="stylesheet" />

<!--Importando java script jquery-->
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>

<!--Corrigindo caracteres especiais-->
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

<title>Cadastrar Locacao</title>
</head>
<body>
<c:import url="cabecalho.jsp"/>

<!--Inicio do FORM-->
<!--Action mvc esta declarado como atalho dentro de web.xml-->
<form action="mvc">

<fieldset>
<legend>Cadastro de Locacao</legend>

<label for="txtCodigoCliente"> Codigo Cliente: </label> 
<input id="txtCodigoCliente" name="txtCodigoCliente" type="text"><br> 

<label for="txtCodigoVeiculo"> Codigo Veiculo:</label> 
<input id="txtCodigoVeiculo" name="txtCodigoVeiculo" type="text"><br> 

<label for="txtDataLocacao">Data Locacao: </label> 
<input id="txtDataLocacao" "type="text" name="txtDataLocacao">  <br />


<label for="txtDataDevolucao">Data Devolucao: </label> 
<input id="txtDataDevolucao" type="text" name="txtDataDevolucao"> <br /> 


</fieldset>

<!--Botão salvar executa o formulario-->
<input value="Salvar" type="submit">

<!--Atributo vai como invisivel para passar o parametro-->
<!--parametro logica define qual classe de controle será instanciada-->
<input type="hidden" name="logica" value="AdicionaLocacaoLogica" />

</form>

<hr></hr>

<c:import url="rodape.jsp"/>

</body>
</html>
Alura Desenvolvimento Back-End Java Sua Carreira em desenvolvimento back-end Java: dos fundamentos à arquitetura de sistemas...

1 Resposta

manjubex
manjubex

Consegui abrir a popup e retornar o valor usando Window.open.

Tela que chama a popup 
<!--Importando as taglibs-->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>


<!--Importando taglib personalizada-->
<%@taglib tagdir="/WEB-INF/tags" prefix="bruno"%>

<html>
<head>
<!--Definindo estilo CSS-->
<link type="text/css" href="css/formulario.css" rel="stylesheet" />
<link type="text/css" href="css/jquery-ui-1.8.20.custom.css" rel="stylesheet" />


<script>

var popup; //A global variable that will act as the Popup ID
function selecionarCliente() {
	//Create the popup and store the returning id in the variable 
	popup = window.open("clienteSelecao.jsp", "popup_id",
		"scrollbars,resizable,width=800,height=400");
}

function selecionarVeiculo() {
	//Create the popup and store the returning id in the variable 
	popup = window.open("veiculoSelecao.jsp", "popup_id",
		"scrollbars,resizable,width=600,height=600");
}

</script>
<!--Importando java script jquery-->
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>

<!--Corrigindo caracteres especiais-->
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

<title><fmt:message key="locacao.cadastrar.title"/></title>
</head>
<body>
<c:import url="cabecalho.jsp"/>

<!--Inicio do FORM-->
<!--Action mvc esta declarado como atalho dentro de web.xml-->
<form action="mvc" name="frm">

<fieldset>
<legend><fmt:message key="locacao.cadastrar.title"/></legend>

<label for="txtCodigoCliente"> <fmt:message key="locacao.codcliente"/> </label> 
<input id="txtCodigoCliente" name="txtCodigoCliente" type="text" readonly="readonly"> 
<input type="button" value="<fmt:message key="botao.selecionacliente"/>" onClick="selecionarCliente()">

<label for="txtNomeCliente"> <fmt:message key="locacao.nomecliente"/> </label> 
<input id="txtNomeCliente" name="txtNomeCliente" type="text" readonly="readonly"> <br />

<label for="txtCodigoVeiculo"> <fmt:message key="locacao.codveiculo"/></label> 
<input id="txtCodigoVeiculo" name=txtCodigoVeiculo type="text" readonly="readonly">
<input type="button" value="<fmt:message key="botao.selecionaveiculo"/>" onClick="selecionarVeiculo()">

<label for="txtNomeVeiculo"> <fmt:message key="locacao.modveiculo"/> </label> 
<input id="txtNomeVeiculo" name="txtNomeVeiculo" type="text" readonly="readonly"> <br /> 

<label for="txtDataLocacao"><fmt:message key="locacao.dataloc"/> </label> 
<bruno:campoData id="txtDataLocacao"/>  <br />

<label for="txtDataDevolucao"><fmt:message key="locacao.datadev"/> </label> 
<bruno:campoData id="txtDataDevolucao"/>  <br />

</fieldset>

<fieldset>
<legend><fmt:message key="locacao.opcionais"/></legend>


<label><fmt:message key="locacao.gps"/></label>
<label for="gpssim" class="label_normal" > <fmt:message key="locacao.sim"/> </label>	
<input id="gpssim" name="rbGps" value="S" type="radio">
 
<label for="gpsnao" class="label_normal" > <fmt:message key="locacao.nao"/> </label>	
<input id="gpsnao" name="rbGps" value="N" type="radio"><br />


<label><fmt:message key="locacao.bebe"/></label>
<label for="bebesim" class="label_normal" > <fmt:message key="locacao.sim"/> </label>	
<input id="bebesim" name="rbBebe" value="S" type="radio">
 
<label for="bebenao" class="label_normal" > <fmt:message key="locacao.nao"/> </label>	
<input id="bebenao" name="rbBebe" value="N" type="radio"> <br />

<label><fmt:message key="locacao.motorista"/></label>
<label for="motoristasim" class="label_normal" > <fmt:message key="locacao.sim"/> </label>	
<input id="motoristasim" name="rbMotorista" value="S" type="radio">
 
<label for="motoristanao" class="label_normal" > <fmt:message key="locacao.nao"/> </label>	
<input id="motoristanao" name="rbMotorista" value="N" type="radio"> <br />

</fieldset>

<!--Botão salvar executa o formulario-->
<input value="<fmt:message key="botao.salvar"/>" type="submit">

<!--Atributo vai como invisivel para passar o parametro-->
<!--parametro logica define qual classe de controle será instanciada-->
<input type="hidden" name="logica" value="AdicionaLocacaoLogica" />
<input type="hidden" name="estado" value="aberto" />


</form>


<hr></hr>

<c:import url="rodape.jsp"/>

</body>
</html>
Popup que retorna o valor: 
<!doctype html>

<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>

<html>
<head>
<!--Importa JSTL-->
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 

<!--Importa minhas tags-->
<%@taglib tagdir="/WEB-INF/tags" prefix="bruno"%> 

<title><fmt:message key="cliente.selecao"/></title>

<!--Corrige problemas de leitura-->
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">

<!--Carrega as Jquery's-->
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/jquery.tablesorter.min.js"></script>
<script src="js/jquery.tablesorter.pager.js"></script>

<script language="Javascript" type="text/javascript"> 

function putData(codigo, nome) {
	var data1 = codigo;
	var data2 = nome;
	window.opener.document.getElementById('txtCodigoCliente').value = data1;
	window.opener.document.getElementById('txtNomeCliente').value = data2;
	
	window.close();	
}

</script> 

<!--Estilo css da tabela-->
<link rel="stylesheet" href="css/tabela.css" media="screen" />

</head>

<body>

<!--Javabean para criar ClienteDAO-->
<jsp:useBean id="dao" class="projeto.dao.ClienteDAO" />

<label for="pesquisar"><fmt:message key="lista.pesquisar"/> </label> <input type="text" id="pesquisar" name="pesquisar" size="30" />
<form name="frm"> 
<table cellspacing="0" summary="lista clientes">
	<thead>
		<tr>
			<th><fmt:message key="lista.codigo" /></th>
			<th><fmt:message key="lista.nome" /></th>
			<th><fmt:message key="lista.email" /></th>
			<th><fmt:message key="lista.endereco" /></th>
			<th><fmt:message key="lista.telefone" /></th>
			<th><fmt:message key="lista.selecionar" /></th>
		</tr>
	</thead>
	
	<tbody>
<!--loop que pega lista clientes e preenche tabela-->
		<c:forEach var="cliente" items="${dao.lista}">
			<tr>
				<td>${cliente.codigo}</td>
				<td>${cliente.nome}</td>
				
				<!--Checa se tem e-mail-->
				<td><c:if test="${not empty cliente.email}">
					<a href="mailto:${cliente.email}">${cliente.email}</a>
				</c:if> <c:if test="${empty cliente.email}">
						E-mail não informado
					</c:if></td>
					
				<td>${cliente.endereco}</td>
				<td>${cliente.telefoneres}</td>
				
				<td><input type="button" value="<fmt:message key="botao.selecionar" />" onClick="putData('${cliente.codigo}', '${cliente.nome}')"></td>
								
			</tr>
		</c:forEach>
	</tbody>
</table>
</form>
<BR />
<BR />
<BR />
<BR />


<!--Barra de páginas-->

<div id="pager" class="pager">
<form><span> <fmt:message key="lista.exibir"/><select class="pagesize">
	<option selected="selected" value="10">10</option>
	<option value="20">20</option>
	<option value="30">30</option>
	<option value="40">40</option>
</select> <fmt:message key="lista.registros" /> </span>
 <img src="imagens/first.png" class="first" />
 <img src="imagens/prev.png" class="prev" />
 <input type="text" class="pagedisplay" />
 <img src="imagens/next.png" class="next" />
 <img src="imagens/last.png" class="last" />
 </form>
 </div>

 
<!--Script da tabela bonita-->
<script>
    $(function(){
      
      $('table > tbody > tr:odd').addClass('odd');
      
      $('table > tbody > tr').hover(function(){
        $(this).toggleClass('hover');
      });

      
      $('#pesquisar').keydown(function(){
        var encontrou = false;
        var termo = $(this).val().toLowerCase();
        $('table > tbody > tr').each(function(){
          $(this).find('td').each(function(){
            if($(this).text().toLowerCase().indexOf(termo) > -1) encontrou = true;
          });
          if(!encontrou) $(this).hide();
          else $(this).show();
          encontrou = false;
        });
      });
      
      $("table") 
        .tablesorter() 
        .tablesorterPager({container: $("#pager")})
        .bind('sortEnd', function(){
          $('table > tbody > tr').removeClass('odd');
          $('table > tbody > tr:odd').addClass('odd');
        });
      
    });

    </script>
<br></br>
<br></br>
<br></br>
<br></br>
<!-- importando rorape-->
<c:import url="rodape.jsp"/>

</body>
</html>

Esta meio ruim de ler, pois esta internacionalizado.

Criado 25 de maio de 2012
Ultima resposta 4 de jun. de 2012
Respostas 1
Participantes 1

Topicos relacionados

Como saber se um mes tem 4 ou 5 semanas?[RESOLVIDO] 31 respostas Como converter inteiro para string! 13 respostas Comando SELECT para selecionar intervalo de data SQL SERVER 12 respostas &, &&, |, ||. Qndo usar? 6 respostas O método split 12 respostas
Alura POO: o que é programação orientada a objetos? Aprenda os conceitos básicos da programação orientada a objetos, como classes, objetos, herança, encapsulamento e polimorfismo, com exemplos.
Casa do Codigo Inteligencia Artificial e ChatGPT: Da revolucao dos... Por Fabricio Carraro — Casa do Codigo