form表单提交且接口回调显示提交成功

前端：
<form method="post" enctype="multipart/form-data" id="formSubmit">
      <div class="row">
           <div class="col-lg-12" style="padding-left:25px;padding-top: 5px">
                <label>请选择文件</label>
                <input type="file" name="file" title="点击选择文件" multiple="" accept="*/*" class="form-control">
           </div>
      </div>
      <div class="row">
           <div style="padding-left:25px;padding-top:10px">
                <input type="submit" class="btn btn-primary">
           </div>
      </div>
</form>

 

JS：
$('#formSubmit').submit(function (event) {
        //首先验证文件格式
        var fileName = $(this).find("input[name=file]").val();
        if (fileName === '') {
            alert('请选择文件');
            return;
        }
        // mulitipart form,如文件上传类
        var formData = new FormData(this);
        $.ajax({
            async: false,
            type: "POST",
            url: "/upload",
            data: formData,
            dataType: "JSON",
            mimeType: "multipart/form-data",
            contentType: false,
            cache: false,
            processData: false,
            success: function (data) {
                if (data.success) {
                    layer.alert("上传成功")
                } else {
                    layer.alert(data.error)
                }
            }
        });
        return false;
    });

　　js代码的最后需要return false 防止表单重复提交，刷新页面。

java:
 @RequestMapping(value = "/upload", method = RequestMethod.POST, produces = "application/json;charset=utf-8")
    @ResponseBody
    public SimpleAjaxResponse uploadSingleFile(HttpServletRequest request, Model model) {
        try {
            DefaultMultipartHttpServletRequest httpServletRequest = (DefaultMultipartHttpServletRequest) request;
            MultipartFile multipartFile = httpServletRequest.getFile("file");
            return new SimpleAjaxResponse(true);
        } catch (Exception e) {
            LOGGER.error(e.getMessage(), e);
            e.printStackTrace();
            return new SimpleAjaxResponse("上传出错了");
        }

    }

　　

转载于:https://www.cnblogs.com/yang-xiansen/p/11205861.html