Neo Framework Forum

Equipe Membro desde: 26/11/2007 13:44:01 Mensagens: 27 Offline

Boa tarde galera,

Tem como atualizar a lista de uma tag <t:detalhe> usando ajax?

No meu caso tenho uma tela de cadastro de serviço, e cada serviço possui uma coleção de guias. O numero de guias será definido pela propriedade Numero de Prestações. Quando o usuário digitar o numero de prestações e clicar no botão pra gerar as guias, o sistema chama a função de ajax e atualiza a lista da tag <t:detalhe>.

Isso é possível?

André, Automaticamente não. Você terá que fazer ele na mão.

Vou pedir ao bruno postar um exemplo. 1 Minuto.

E ai André beleza?

To meio na correria aqui então vou postar as classes que fazem parte do exemplo sem muitas explicações, aí qualquer dúvida você posta de novo que agente vai trocando idéias.
O meu caso eu escolho um produto em uma lista e de acordo com este produto ele carrega via ajax uma outra lista com produtos similares.

Código JSP com o detalhe
Code:

 <t:detalhe name="lista">
 	
 	.
 	.
 	.
 	
 	<t:property name="produtoorigem" onchange="campo = ${index}; callbackFunction = ajaxCallBackFunction; var c = this.value; if(c != ''){sendRequest('/aplicacao/modulo/controller/ActionDoAjax?cdproduto='+c)}"/>
 	<c:choose>
 		<c:when test="${n:ognl(\"index instanceof java.lang.Number\")}">
 			<t:property name="produtodestino" itens="${listaProdutosDestino[index]}"/>
 		</c:when>
 		<c:otherwise>
 			<t:property name="produtodestino" itens="null"/>
 		</c:otherwise>
 	</c:choose>		
 	
 	.
 	.
 	.
 
 </t:detalhe>

Função JavaScript que renderiza o resultado na tela sem recarregar o restante da página
Code:

 <script language="javascript" type="text/javascript">
 	var campo;
 	function ajaxCallBackFunction(data){
 		eval(data);
 		var element = document.forms[0]['listaconfigdeparaitem[' + campo + '].produtodestino'];
 		element.innerHTML = '';
 		var i = 0;
 		for (i = 0; i < mapa.length; i++) {
 			element.options[i] = new Option(mapa[i][1],mapa[i][0]);
 		}
 	}
 </script>

Controller com a action que será chamado pelo ajax
Code:

 package br.linkcom.util.controller;
 
 import java.io.IOException;
 import java.util.ArrayList;
 import java.util.List;
 
 import javax.servlet.ServletOutputStream;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
 
 import org.springframework.web.servlet.ModelAndView;
 
 import br.com.linkcom.neo.bean.annotation.Bean;
 import br.com.linkcom.neo.controller.Controller;
 import br.com.linkcom.geral.bean.Produto;
 import br.com.linkcom.geral.dao.ProdutoDAO;
 
 @Controller(path="/modulo/controller/ActionDoAjax")
 	
 @Bean
 public class ConfigDeParaController implements org.springframework.web.servlet.mvc.Controller{
 	
 	public ModelAndView handleRequest(HttpServletRequest request, HttpServletResponse response) throws Exception {
 		List<Produto> listaProduto = new ArrayList<Produto>();
 		try {
 			Integer cdprodutoorigem = AjaxController.getParametro(request,response,"cdproduto");
 			Produto produto = new Produto();
 			produto.setCdproduto(cdprodutoorigem);
 
 			//Aqui é o local onde eu busca a lista de similares de acordo com o produto de origem escolhido
 			listaProduto = ProdutoDAO.getInstance().findSimilares(produto);
 		} 
 		catch (Exception e) {
 			response.getOutputStream().print("javascript:alert('" + e.getMessage() + "');");
 		}
 		response.setContentType("text/html; charset=ISO-8859-1");
 		printVar(response.getOutputStream(), listaProduto);
 		return null;
 	}
 	
 	private void printVar(ServletOutputStream out, List<Produto> lista) throws IOException {
 		StringBuffer sbVar = new StringBuffer();
 		sbVar.append("var mapa = [");
 		sbVar.append("[\"<null>\",\"\"],");
 		
 		String cdproduto = "";
 		String nome = "";
 		
 		for (Produto produto : lista) {
 			cdproduto = produto.getCdproduto().toString();
 			nome = produto.getNomeResumido();
 			sbVar.append("[\"br.com.linkcom.geral.bean.Produto[cdproduto=" + cdproduto + "]\",\"" + nome + "\"],");
 		}
 		sbVar.replace(sbVar.length() - 1, sbVar.length(), "");
 		sbVar.append("];");
 		out.print(sbVar.toString());
 	}	
 }

Ajax Controller com métodos úteis para manipulação de parâmetros
Code:

 package br.linkcom.util.controller;
 
 import java.util.regex.Matcher;
 import java.util.regex.Pattern;
 
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
 	
 public class AjaxController {
 	
 	public static Integer getParametro(HttpServletRequest request, HttpServletResponse response, String campo) {
 		Integer cdparametro = new Integer(0);
 		String parametro = request.getParameter(campo) != null ? request.getParameter(campo) : "";
 		Matcher casamento = Pattern.compile(".{0,60}?\\["+campo+"=(\\d+)\\]").matcher(parametro);
 		if (casamento.matches()) {
 			cdparametro = new Integer(casamento.group(1));
 		}
 		return cdparametro;
 	}
 	
 	public static String getParametroString(HttpServletRequest request, HttpServletResponse response, String campo) {
 		String parametroString = new String("");
 		String parametro = request.getParameter(campo) != null ? request.getParameter(campo) : "";
 		Matcher casamento = Pattern.compile(".{0,60}?\\["+campo+"=(\\d+)\\]").matcher(parametro);
 		if (casamento.matches()) {
 			parametroString = new String(casamento.group(1));
 		}
 		return parametroString;
 	}
 }

Agora é só quebrar um poquinho a cabeça pra implementar na sua situação aí andré. Qualquer dúvida manda ae...

Equipe Membro desde: 26/11/2007 13:44:01 Mensagens: 27 Offline

Essa galera do Neo é muito gente boa.

Bruno e Pedro, valew mesmo. Consegui fazer a atualização do detalhe usando ajax e ficou fera, só que deu um trabalhooooo....

No meu caso, tenho vários inputs pra atualizar dentro do detalhe. Fiz a varredura dos campos com FOR utilizando form[i]. Porém, tive que fazer uma gambiarra pra dar certo. Tem alguma forma de acessar esses inputs pelo id? Eu procurei no código fonte mas não encontrei onde vcs colocam o id dos campos do detalhe. Tipo, pra acessar o property VALOR na terceira linha.

Mais uma vez muito obrigado. Vcs estão de parabéns pelo framework e pelo suporte!

Equipe Membro desde: 26/11/2007 13:44:01 Mensagens: 27 Offline

Bruno,

Eu consegui acessar os elementos da tabela através da notação form[i], onde i é o numero do elemento. Tive que contar os elementos do form, o código não ficou bom mas funcionou.

Vc conseguiu obter o elemento com a seguinte notação:

var element = document.forms[0]['listaconfigdeparaitem[' + campo + '].numero'];

Procurei no código que vc passou mas não achei referência para este atributo 'listaconfigdeparaitem' e não consegui entender como funciona.

Teria como vc me dar uma dica de como pegar um elemento da tabela?

Valew!

andré, no t:detalhe, você pode usar o atributo id,

assim:

<t:detalhe name="lista" id="seuid">

e caso use jquery ou similares, você pode fazer assim também:

Pega todos os inputs que estão dentro da tabela:
Code:

 $("#seuid input").each(function(){
      alert(this.value);
 });

Pega todos os inputs to tipo text
Code:

 $("#seuid input[@type=text]").each(function(){
      alert(this.value);
 });

Entendeu?