前端学习之AJAX表单提交

    传统的项目可以由SpringMVC的处理器适配器和处理器映射器进行处理，并由视图解析器返回相应的页面。在前后端分离的情况下，前端需要使用AJAX向后台进行数据请求，这个时候不能简单的使用表单的 submit 提交方式，但是使用普通的$.ajax()方法则会遇到提交给后台的文件为NULL

    以下是我的解决办法：

    一、表单：

<form id="myForm" enctype="multipart/form-data" >     <input type="file" name="file" required style="display: none;" id="previewImg">     <input type="button" οnclick="add()" value="提交" /> </form>

    二、js：

    首先要引入jquery.form.js文件

function add() {     var options = {         type: 'post', url: 'http://localhost:9911/cms/addCarousel', success: function(ret) {     alert(123); }, error: function(ret) {     alert("shang chuan cuo wu"); }     };    $('#myForm').ajaxSubmit(options); }

    三、controller代码

@RequestMapping(value = "/addCarousel", methods = RequestMethod.POST) public RecycleResult addCarousel(HttpServletResponse response, MultipartFile file, Carousel carousel){ // 相应的处理 return RecycleResult.ok(); }

    四、小结

        今天在做项目的时候遇到的一个问题，ajax提交中的表单序列化只能序列化数据，不能序列化文件，带有文件的表单提交直接使用jquery的form插件中的ajaxSubmit方法即可。

   如果有错误欢迎大家批评指正，谢谢！！！