您好我在spring mvc中使用<input type="file">
上传文件。我在文件的变更事件上提交表格并显示上传过程。但文件内容未上传,并在服务器上获取null。如果我上传点击提交按钮,一切正常。这是我的代码:
Html文件:
<form:form method="POST" modelAttribute="book" id="saveBook"
name="saveBook" enctype="multipart/form-data">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>Book :</td>
<td> </td>
<td>
<input type="file" name="file" id="file" class="edit_form" onchange="return upload('<c:url value='/bookstore/librery/uploadBook' />', 'saveBook', this);" />
<form:errors path="file" />
</td>
</tr>
</table>
</form:form>
Jquery代码:
function upload(requestUrl, formId, clickedObj) {
if (clickedObj && eval(clickedObj) && clickedObj != null && clickedObj != undefined) {
clickedObj.disabled = true;
}
var formData = new FormData(document.getElementById(formId));
$.ajax({
'url': requestUrl,
'type': 'POST',
'data': formData,
'cache': false,
'contentType': false,
'processData': false,
success: function (data) {
$("#tempLoc").val(data.tempLoc);
$("#bookPreview").attr("src", "data:image/png;base64," + data.image);
$("#image").val(data.image);
clickedObj.disabled = false;
},
error: function (xhr, status, err) {
clickedObj.disabled = false;
var tempErrorHTML = getAjaxRequestErrorMsg(xhr);
alert(tempErrorHTML);
},
xhr: function () {
var xhr = new window.XMLHttpRequest();
xhr.upload.addEventListener("progress", function (evt) {
if (evt.lengthComputable) {
var percentComplete = (evt.loaded / evt.total) * 100;
//Do something with upload progress
alert('percentComplete = ' + percentComplete + '%');
}
}, false);
return xhr;
},
}, 'json');
}
如果我点击提交按钮调用上传功能,那么每件事都可以。我认为表单是在文件上传之前提交的,但不知道如何使事情正确。
我无法使用提交功能,因为我需要显示上传进度条。请帮忙。
提前致谢。