form表单提交FormData数据

最新推荐文章于 2024-08-15 21:17:34 发布

bladeandmaster88

最新推荐文章于 2024-08-15 21:17:34 发布

阅读量2.3k

点赞数

分类专栏： springMVC

本文链接：https://blog.csdn.net/bladeandmaster88/article/details/99698809

版权

springMVC 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

代码见https://gitee.com/bladeandmaster/freemarkerDemo

1、第一种直接使用form表单的submit提交

2、第二种采用ajax提交，需要设置contentype:"application/x-www-form-urlencoded"

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试form表单提交数组数据</title>
</head>
<body>
    <form id="form" action="getFormData" method="post">
        <div>
           <input name="ticketCarts[0].count" />
           <input name="ticketCarts[0].name"/>
        </div>
        <div>
            <input name="ticketCarts[1].count"/>
            <input name="ticketCarts[1].name"/>
        </div>

        <button type="submit">submit直接提交</button>
        <a id="ajaxSubmit">ajax提交</a>
    </form>
    <script type="text/javascript" src="/static/commons/js/jquery.min.js"></script>
    <!--[{"count":1,"name":"aa"},{"count":2,"name":"bb"}]-->

    <script type="text/javascript">
        $("#ajaxSubmit").click(function(){
            var serializeArray = $("#form").serializeArray();//数组对象
            console.info("serializeArray-------------");
            console.info(serializeArray);

            $.ajax({
                type: 'post',
                url: 'getFormData',
                data: serializeArray,
                dataType: 'json',
                contentype:"application/x-www-form-urlencoded",
                success: function(jsonData) {
                    console.info("后端返回数据--------");
                    console.info(jsonData);
                }
            })
        });
    </script>
</body>
</html>

package com.pingan.core.controller;

import com.pingan.core.entity.TicketCarts;
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
@Slf4j
public class FormDataController {

    //localhost:8080/formDataView
    @RequestMapping("/formDataView")
    public String formDataView(){
        return "formData";
    }

    @RequestMapping("/getFormData")
    @ResponseBody //application/x-www-form-urlencoded
    public TicketCarts getFormData(TicketCarts ticketCarts){
        return ticketCarts;
    }
}