Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

DÚVIDAS SPRINGMVC x AJAX x JAVASCRIPT

Boa Tarde,

estou com uma grande dúvida, que já tentei de diversas formas e não funciona, a minha dúvida é a seguinte, gostaria de saber se no "s:mvcUrl" abaixo, que está dentro do "$.get" conseguiria enviar o "id" recebido do :

<a href="#" onClick="removerEntrada(${entrada.id})">Remover</a>

Pois, já tentei enviar com o ".arg" só que se eu colocar dessa forma:

function removerEntrada(id){    
            alert("JAVASCRIPT ID: " + id)                                                                                            
        $.get("${s:mvcUrl('PPFC#removerEntrada').arg(0,'id').build()}", {'id' : id}, function() {                    // 1> Utilizar o RequestMapping(pagaConta), envia o ID do que está sendo PAGO AGORA // Como o SPRING está tratando o MAPEAMENTO, para encontrar o correto REQUEST MAPPING, foi utilizado o "mvcUrl"
                  $("#entrada_"+id).html("removido");                                                    // 2> Aqui muda a COLUNA DA LINHA ATUAL para um HTML "Paga". (Assim evitando ATUALIZAÇÃO DA PÁGINA) -> #conta_"+id) = Se referencia a <td> que tem isso.
                });                                                                                        // $.post ("Aqui fica o que vai como requisição","Aqui se utiliza o que vem de RESPONSE")
        }

ou sem os "apostos" e etc, ele não envia, apenas se eu colocar por exemplo:

$.get("${s:mvcUrl('PPFC#removerEntrada').arg(0,'4').build()}",

Ai sim, ele conseguiria remover o item da lista que tem o ID 4.

------- JSP:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<%@ taglib tagdir="/WEB-INF/tags" prefix="tags" %>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>
<%@ taglib uri="http://www.springframework.org/tags" prefix="s" %>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>


<tags:pageTemplate titulo="Lista Produtos">


 <jsp:attribute name="extraScripts">

     <script>    
                                                                                                        //$.get('aqui vai a URL', 'depois os dados', 'depois a função de sucesso');
        function removerEntrada(id){    
            alert("JAVASCRIPT ID: " + id)                                                                                            
        $.get("${s:mvcUrl('PPFC#removerEntrada').arg(0,'4').build()}", {'id' : id}, function() {                    // 1> Utilizar o RequestMapping(pagaConta), envia o ID do que está sendo PAGO AGORA // Como o SPRING está tratando o MAPEAMENTO, para encontrar o correto REQUEST MAPPING, foi utilizado o "mvcUrl"
                  $("#entrada_"+id).html("removido");                                                    // 2> Aqui muda a COLUNA DA LINHA ATUAL para um HTML "Paga". (Assim evitando ATUALIZAÇÃO DA PÁGINA) -> #conta_"+id) = Se referencia a <td> que tem isso.
                });                                                                                        // $.post ("Aqui fica o que vai como requisição","Aqui se utiliza o que vem de RESPONSE")
        }

     </script>

 </jsp:attribute>


<jsp:body>    

    <div class="container">    
    <h1>Entradas || ${empresa}</h1>
    <table class="table table-striped table-bordered table-hover " >
        <tr>
            <th>ID</th>
            <th>EMPRESA</th>
            <th>CÓD.BARRA</th>
            <th>DESCRIÇÃO</th>
            <th>FORNECEDOR</th>
            <th>QT.TOTAL</th>
            <th>DATA VENCIDO</th>
            <th>REMOVER</th>
        </tr> 

        <c:forEach items="${produtos}" var="entrada">                                    <!-- Vai receber um List de Produtos para mostrar todos os produtos buscados -->
            <tr>
                <td>${entrada.id}</td>
                <td>${entrada.empresa.nome}</td>
                <td>${entrada.produto.codBarra}</td>
                <td>${entrada.produto.nome}</td>
                <td>${entrada.fornecedor.nome}</td>
                <td>${entrada.quantidadeTotal}</td>
                <td><fmt:formatDate value="${entrada.dataVencimento.time}" pattern="dd/MM/yyyy"/></td>
                <td id="entrada_${entrada.id}">
                    <a href="#" onClick="removerEntrada(${entrada.id})">Remover</a>
                </td>
            </tr>
        </c:forEach>
    </table>
  </div>

  </jsp:body>

</tags:pageTemplate>

------- MÉTODO REMOVER DO CONTROLLER:

// REMOVE ENTRADA
    @RequestMapping(value="/remover")
    public void removerEntrada(Long id, HttpServletResponse resp){
        System.out.println("MÉTODO ID: " + id);
        produtoPorFornecedorDao.remove(id);
        resp.setStatus(200);                                                                              // Indica para A "FUNCTION" que requisitou esse método que tudo funcionou OK (200) (E assim executando o response do FUNCTION) 
    }
5 respostas

Frank, tudo bem ?

Se você fizer dessa forma não rola ?

function removerEntrada(id){    
            alert("JAVASCRIPT ID: " + id)                                                                                            
        $.get("${s:mvcUrl('PPFC#removerEntrada').arg(0, "+id +").build()}", {'id' : id}, function() {              
                  $("#entrada_"+id).html("removido");                                                    
                });                                                                                       
        }

Boa tarde, obrigado pela resposta rápida, vou tentar novamente, mas já tentei de tantas formas, que acho que já até tentei essa, vou testar agora novamente.

Então... e meio que não acontece nada, ele entra na "Function" mas não executa o método e nem acessa o RequestMapping referente.

Já testei:

$.get("${s:mvcUrl('PPFC#removerEntrada').arg(0,id).build()}", {'id' : id}

$.get("${s:mvcUrl('PPFC#removerEntrada').arg(0,'id').build()}", {'id' : id}

$.get("${s:mvcUrl('PPFC#removerEntrada').arg(0,'"+id+"').build()}", {'id' : id}

e a maioria desses ele não executa o $:get, somente se eu colocar o número diretamente, alguma outra possibilidade ?

Frank, outra coisa que faço é :


function removerEntrada(id){    
            alert("JAVASCRIPT ID: " + id)                                                                                            
        $.get("${s:mvcUrl('PPFC#removerEntrada').arg(0,'${id}').build()}", {'id' : id}, function() {              
                  $("#entrada_"+id).html("removido");                                                    
                });                                                                                       
        }

Mas isso quando estou mexendo com js puro, não sei se no seu caso isso vai rolar, mas não custa tentar :D

solução!

Então... O mesmo caso, ele não executa, eu já tentei um método só que acho que fica muito específico, que seria no método do CONTROLLER fazer da seguinte forma:

@RequestMapping(value="/remover")
    public void removerEntrada(Long id, HttpServletResponse resp, HttpServletRequest req){
        System.out.println("MÉTODO ID: " + id);
        produtoPorFornecedorDao.remove(Long.parseLong(req.getParameter("id")));
        resp.setStatus(200);                                                                              
    }

Dessa forma pelo HttpServletRequest ele pegaria o Parâmetro passado com o name "id", mas como comentei, acho que é algo muito específico, fico no aguardo se alguém possuir uma solução mais simples.