使用ajax()或者 bootstrapTable() 传递form表单——包括表单含文件时

1、写在前面

主要介绍使用$.ajax()或者$(’#tableID’).bootstrapTable()传递form表单，组装数据的方法。
p.s. 给各位bootstrap大神在第四节留了个问题——即直接使用bootstrapTable传带有文件的表单该怎么写，我这里只想到了一种间接的方式。

2、基础知识

①$.ajax()或者$(’#tableID’).bootstrapTable({})内各自的属性;
不熟悉的可参考官方api.
jQuery：
https://api.jquery.com/jQuery.ajax/
https://www.w3school.com.cn/jquery/ajax_ajax.asp
bootstrapTable:
https://bootstrap-table.com/docs/api/table-options/
https://www.bootstrap-table.com.cn/doc/api/table-options/
②以上方法的contentType属性、<form>标签的enctype属性(传的值必须要与对应的type搭配好）可参考
https://www.runoob.com/http/http-content-type.html
https://www.w3school.com.cn/tags/att_form_enctype.asp
③以上方法与Controller层的交互（即Controller层怎么接收View层传过来的参数-JSONObject？DataObject？POJO?HttpServletRequest?），各人环境不同，架构不同，方式也很多，这里不想再详述。

3、 $.ajax()

用$.ajax({})传表单是把数据放到data属性里

组装formData有三种方式：
①可以人工拼key:value；

②可以用$(“formID”).serialize()方法，会把表单中的值拼成key=value&key=value的形式,其中key即是<from>下标签的name属性

上面都是指定contentType为x-www-form-urlencoded（默认的key/value格式——与json格式相比好像就是key不带引号）。
如果想传json，可以使用javaScript的JSON.stringify()方法，并指定contentType为application/json

如果想直接把form表单中的数据转成json格式（上图还是手动拼json作为JSON.stringify()的参数）。javaScript,jQuery好像没有现成的函数，可以试试参考这位大神自己写的函数：
https://www.cnblogs.com/wangzhaobo/p/7727461.html

③也可以用FormData对象，优点是可以传文件，传文件时需要把contentType设置为false

关于使用$.ajax()方法传表单，且表单中包含文件时的前后端写法具体可参考（两位大神写的很好）：
https://www.cnblogs.com/Renyi-Fan/p/9581951.html
https://www.kancloud.cn/lirg199/devnote/343374

3*、 $("#formID").ajaxSubmit({})

这个是一种简便写法，如果一次操作只传一个表单的话可以用这个。它可以自动组装表单里已有的数据，不用再自己往data属性里加（自动组装的key是form表单中各个标签的name属性，value是对应的值）（这时候你再往data属性里写的话，可以自定义一些form表单里没有的值）

4、 $(’#tableID’).bootstrapTable({})

这是bootstrapTable自己封装的一个与后台交互数据的方法，不知道底层用的是不是ajax。
这个方法是用queryParam属性放请求参数，注意这个类型是放函数的（其实就是把数据放在返回值里），不能像ajax那样直接放data.


在queryParam里放参数，跟$.ajax()里的data里放参数差不多，就是注意要放在返回值里。
①也可以人工拼key:value。像上图那样
②也可以用$(“formID”).serialize()方法，还是别忘了contentType（这个跟ajax一样）

③问题来了，好像不能用FormData了

这样前端会报错（即使表单里没有文件，只有一般数据也报这个错）

或者说我哪个参数配置的不对？网上也找不到类似的问题。
如果想用$(“tableid”).bootStrapTable()方法直接传带有文件的表单，应该怎么写？有做过的大佬吗？
serialize()方法对文件是不生效的，
https://www.cnblogs.com/youmingkuang/p/11255062.html
https://www.cnblogs.com/jierong12/p/8865637.html

$.ajax()倒是能用FormData对象传文件，所以现在我只能先用$.ajax()向后台请求数据，再将返回的数据再赋给bootstrapTable初始化。。。

5、 写在最后

前后端的交互还是多用开发者工具调试；结合官方api看帖子，只看帖子难免偏颇。