Question

Ajax代码：

var str = $("#observationForm").serialize();

    $.ajax({
        type : "post",
        data : str,
        url : "updateObservation",
        async : true,
/* dataType : "multipart/form-data", */
        success : function() {
            alert("success");
        }
    });

JSP-Spring Form：

<form:form modelAttribute="ObservationModal" action="updateObservation" id="observationForm">
    <label class="control-label">Tooth No</label>
    <input type="text" class="form-control" name="tooth" id="tooth" placeholder="Enter tooth no" />
    <label class="control-label">Uploaded file(PDF)</label>
    <input type="file" class="form-control" name="attachment" value="" id="attachment" placeholder="" />        
    <input type="button" value="Save" onclick="updateObservation();" />
</form:form>

控制器类

@RequestMapping(value = "/updateObservation", method = RequestMethod.POST)
public @ResponseBody String updateObservation(
        @ModelAttribute("ObservationModal") ObservationModal formObj) {
    String result = "";

    System.out.println(":" + formObj.getTooth());
    System.out.println(formObj.getAttachment());

    return result;
}

模态类

public class ObservationModal implements Serializable {
    int tooth;
    private List<MultipartFile> attachment;

    public int getTooth() {
        return tooth;
    }

    public void setTooth(int tooth) {
        this.tooth = tooth;
    }

    public List<MultipartFile> getAttachment() {
        return attachment;
    }

    public void setAttachment(List<MultipartFile> attachment) {
        this.attachment = attachment;
    }

}

我无法在控制器中获取值文本框值或附件。 ObservationModal始终为null

Answer 1

要进行ajax调用，url必须是＆＃39; / projectName / actualurl＆＃39;类型。在你的情况下url：＆＃39; / projectName / updateObservation＆＃39;。并且还添加dataType：＆＃39; text＆＃39;致电。

Answer 2

无法使用AJAX上传文件。实现它你可以使用formdata for fileupload，但这只适用于html5支持的浏览器

var form = $('form')[0]; // You need to use standart javascript object here
var formData = new FormData(form);

如果您希望它甚至可以用于旧浏览器，您可以使用iframe和formupload形式。

Answer 3

要正常上传文件，您需要在表单中使用encType="multipart/form-data"。如果您想使用Ajax上传文件，那么除了简单的ajax调用外，您还需要使用其fileupload插件。有关详细信息，请查看此处：Link1，Link2，Link 3， Link 4

提交文件的Ajax表单提交不起作用Spring MVC

3 个答案: