使用MVC中的Jquery上传文件
我需要从我的模态弹出窗口使用jquery上传文件。 但是我在ajax调用期间将HttpPostedFileBase视为null。 任何人都可以帮我解决这个问题。 下面是jquery代码：
function uploadDocument(contactId, tripId, file) { if ($('#documentUploadInput').val() == '') { alertify.error('Please select a file to upload'); return; } $.ajax({ url: '/CRMDomain/ContactDetail/UploadDocument', data: { contactId: contactId, tripId: tripId, file: file }, type: 'POST', success: function () { alertify.success('Uploaded'); $('#CRMUploadDocumentModal').modal('hide'); }, error: function () { alertify.error('Not Uploaded'); } });
}
这就是我调用jquery函数的方式：
您无法使用Ajax轻松发布文件。
我一直使用的最佳解决方案是使用jQuery Form Plugin，然后你应该将你的.ajax更改为.ajaxForm 。
您可以查看此答案以获取更多详细信息。
您必须使用FormData将多部分文件格式发送到控制器操作。
尝试以下ajax查询来发布文件：
$.ajax({ url: '/CRMDomain/ContactDetail/UploadDocument', data: { contactId: contactId, tripId: tripId, file: new FormData($("#documentUploadInput")[0].files[0]) }, type: 'POST', contentType: false, processData: false, success: function () { alertify.success('Uploaded'); $('#CRMUploadDocumentModal').modal('hide'); }, error: function () { alertify.error('Not Uploaded'); } });
您需要手动设置processData: false ，否则jQuery会将您的文件转换为字符串。 而且您还需要设置contentType: false因为jQuery会在提交请求时覆盖您的内容类型。
在问题中发布您的控制器操作。
希望这可以帮助。
你需要改变一点代码。
var files = $('#documentUploadInput').get(0).files; var data = new FormData(); if (files.length > 0) { data.append('file', files[0]); } $.ajax({ url: '/CRMDomain/ContactDetail/UploadDocument', type: 'POST', data: data , cache: false, contentType: false, processData: false, dataType: 'JSON', success: function (data) { alert(data) }, error: function errorAlert(e, errorMsg) { alert("Your request was not successful: " + errorMsg); } });
$(function () { $('#btnSave').click(function () { var fileUpload = $("#documentUploadInput").get(0);//Upload input box var file = fileUpload.files; var data= new FormData(); for (var i = 0; i < files.length; i++) { data.append('file', file[i]); } data.contactId = $("#ContactId").val(); data.tripId= $("#tripId").val(); $.ajax({ url: "/CRMDomain/ContactDetail/UploadDocument", type: "POST", contentType: false, processData: false, data: data, success: function (result) { alert(result); }, error: function (err) { alert(err.statusText); } }); }); })