• 前端提交的几种方式


    后台接收代码:

    @PostMapping("/post/a")
     public String postA(User user){
            System.out.println("/post/a");
            System.out.println(user);
            return user.toString();
     }
    
     @PostMapping("/post/b")
     public String postB(@RequestBody User user){
         System.out.println("/post/b");
         System.out.println(user);
         return user.toString();
     }
    

    对于 postA方法,则前端的提交方式为:

    contentType:"application/x-www-form-urlencoded"

    data:$("#formId").serializaArray() / 或者 data: $('#form1').serialize(),

    ----------------

    对于 postB方法,则前端的提交方式为:

    contentType:"application/json"

    data:JSON.stringify(data)

     ---------------------------------------------------------------------------------------------------------------------------

    如果请求提交一个list集合:

    前端代码:

    <form id="inputForm" th:action="@{'/messageTpl/save'}" method="post">
        
                        <input type="hidden" th:name="|messageTpls[0].createDate|" th:value="${tpl.createDate}"/>
                        <input type="hidden" th:name="|messageTpls[0].delFlag|" th:value="${tpl.delFlag}"/>
     <input type="hidden" th:name="|messageTpls[1].createDate|" th:value="${tpl.createDate}"/>
                        <input type="hidden" th:name="|messageTpls[1].delFlag|" th:value="${tpl.delFlag}"/>
    <input type="button" class="button" value="提交" onclick="sendListData()"/>
    </form>
    <script>
    function sendListData() {
            var params = {};
            var t = $("form:eq(0)").serializeArray();
            $.each(t, function () {
                params[this.name] = this.value;
            });
            const action = $("form:eq(0)").attr("action").replace("/back", "");
            $.ajax({
                url: baseUrl + action,
                async: true,
                type: 'POST',
                data: params,
                contentType: "application/x-www-form-urlencoded",//表单提交
                dataType: "json",
                success: function (res) {
                }
            })
    }
    </script>        
    View Code

    后台代码:

       @PostMapping("/save")
       @ResponseBody
       public RestResponse saveSmsTpl(MessageTplReq req) {
       }
    
       public class MessageTplReq {
    
          private List<MessageTpl> messageTpls;
          getter...
          setter...  
      }
  • 相关阅读:
    Docker安装
    MVC-HtmlHelper简单总结
    D3.js
    分布式事务seata
    彻底搞懂JAVA路径问题
    idea 代码生成
    自动生成 serialVersionUID 的设置
    狂神说SSM框架系列连载
    缓存穿透、缓存击穿、缓存雪崩区别和解决方案
    多线程
  • 原文地址:https://www.cnblogs.com/dwb91/p/10074129.html
Copyright © 2020-2023  润新知