weixin_33675507 2019-01-18 00:15 采纳率: 0%
浏览 26

带有Spring-MVC的Ajax POST

These days I have had an issue and I couldn't solve it yet. I have a shopping cart, and it works with jQuery. So I get the products in a GET petition (I use Spring-MVC), and then I add products into the cart with jQuery. Finally I want to send this data (I mean, product id, quantity, etc) to my Spring Controller, and I've tried to use an Ajax petition. Below I show you the code. Notice that if I use $(selector).click(), I can show the data in the controller, but if I use $(selector).submit(), I have a lot of problems. I think I really don't understand how it works, so I would need help.

Controller

@PostMapping(value = "/carrito",
        consumes = {"application/json", MediaType.APPLICATION_FORM_URLENCODED_VALUE}, 
        produces = "application/json")
        //produces = {MediaType.APPLICATION_ATOM_XML_VALUE, MediaType.APPLICATION_JSON_VALUE})
public @ResponseBody String confirmaCarrito(@RequestBody ProdAJAX prod) { 


    System.out.println("X: " + prod.getX());
    System.out.println("Y: " + prod.getY());

    return "redirect:/home";
}

HTML

    <form th:action="@{/pedido/carrito}" th:object="${cliente}" method="post">

<!-- Product list -->


<div class="col-sm-4">
            <h2>Carrito</h2>
            <!-- Elementos del carrito -->
            <ul id="carrito" class="list-group"></ul>
            <hr></hr>

            <!-- Precio total -->
            <p class="text-right">
                Total: <span id="total"></span>&euro;
            </p>

            <input type="submit" value="Confirmar" id="confirmaCarrito"
                class="btn btn-crear"></input>
        </div>
    </div>

</form> 

jQuery

<script>
$(document).ready(function() {

    let i = 0;
    $(".addButton").click(function() {

        var miNodo = $("<li></li>");
        var miProd = $("<span></span>")
        var miCant = $("<input></input>");
        var miPrecio = $("<span></span>");

        miNodo.attr("posicion", i);
        miNodo.attr("class", "nodo list-group-item text-right");

        miProd.attr("name", "prod");
        miProd.attr("idProd", $(this).attr("id"));
        miProd.text($(this).attr("name"));

        miCant.attr("idCant", $(this).attr("id"));
        miCant.attr("type", "number");
        miCant.attr("class", "cant");
        miCant.attr("value", 1);
        miCant.attr("name", "cant");

        miPrecio.attr("idPrecio", $(this).attr("id"));

        miPrecio.text($(this).attr("precio"));

        miNodo.append(miProd);
        miNodo.append(miCant);
        miNodo.append(miPrecio);
        $("#carrito").append(miNodo);
        i = i + 1;

    });

    $("#confirmaCarrito").submit(function(event) {

        //data["id"] = $(".nodo").attr("idNodo");
        //data["id"] = 5;
        //data["cant"] = $(".cant").attr("value");

        //var prod = $("prod").attr("idProd");
        //var cant = $(".cant").val();
        //var data = idProd.concat(",", cant);

        var data = {
            "x" : 100,
            "y" : 200
        };

        $.ajax({
            type : "POST",
            contentType : "application/json; charset=UTF-8",
            url : "/pedido/carrito",
            data : JSON.stringify(data),
            dataType : "json",
            success : function(data) {

                if (data == "SUCCESS") {
                    alert(data);
                } else {
                    alert(data);
                }

            }
        // timeout: 600000,
        //async : true,

        });

        event.preventDefault();

    });

});

Actually if I use .click() it works, but if I use .submit() it doesn't work. Thanks!

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 matlab实现基于主成分变换的图像融合。
    • ¥15 对于相关问题的求解与代码
    • ¥15 ubuntu子系统密码忘记
    • ¥15 信号傅里叶变换在matlab上遇到的小问题请求帮助
    • ¥15 保护模式-系统加载-段寄存器
    • ¥15 电脑桌面设定一个区域禁止鼠标操作
    • ¥15 求NPF226060磁芯的详细资料
    • ¥15 使用R语言marginaleffects包进行边际效应图绘制
    • ¥20 usb设备兼容性问题
    • ¥15 错误(10048): “调用exui内部功能”库命令的参数“参数4”不能接受空数据。怎么解决啊