MVC file upload

Question

How to get XmlHttpRequest response data on success in MVC? I have to save HttpPostedBasefile and I need to track the success data.

kalai vanan · Answer

Hi Suraj, can you please use Dropzone.js ,Its very easy to implement And Opensource too.

sai roja · Answer

Hi Refer this File Upload in ASP.Net MVC application https://aspdotnet-kishore.blogspot.in/2014/10/mvc-file-upload-in-aspnet-mvc.html

Suraj Kumar · Answer

Hello, Please have a look to the below code. As you can see below after success I can track everything in data and can put condition based on the value in that data. In the same manner I want to track the data after xhr request send where I am stuck. I have not to show the message only. I want to show the data of employee for which I have send the request. Now I am sending it to Index action but if I will be able to track the sent data then I can show that employee data. $.ajax({ url: '@Url.Action("CompetencyAddEdit", "GoalAssessment")', type: "POST", data: { "id": compId, "competencyId": compMstId, "selfRemarks": compDesc }, "success": function (data) { debugger; if (data.IscompExistResult >= 1) { //alert("This Competency already added"); swal( '', 'This Competency already added!', 'warning' ); return false; }

Srikant Maruwada · Answer

Hi Suraj, In XMLHttpRequest, you have "OnReadyStateChange" event. In this you will get the response from controller. Try below : var xhr = new XMLHttpRequest(); ... xhr.open( "POST" , "/GoalAssessment/ContributionAddEdit/" , true ); xhr.send(fd); xhr.onreadystatechange = function () { if (xhr.readyState === 4) { var response = JSON.parse(xhr.responseText); if (xhr.status === 200 && response.status === 'OK' ) { console.log( 'successful' ); } else { console.log( 'failed' ); } }

Suraj Kumar · Answer

Hello Rajeesh Sir, first of all thank you for reply . Let you know I am not using Formdata. I have simply used and sending action parameter using below line var xhr = new XMLHttpRequest(); var fd = new FormData(); fd.append('file', document.getElementById('filecontribution').files[0]); fd.append('id', conId); fd.append('condata', conDesc); xhr.open("POST", "/GoalAssessment/ContributionAddEdit/", true); Now I want to track the employee code and other data after successfull the action and dbSaveChange(). Because we want to reassign that employee code in dropdown after saving the record and fetch the saved file as link to download in same tab. For more understanding I have attached the sample what I have used in my project.

Srikant Maruwada · Answer

Hi Suraj To post the file using ajax in MVC. You have to submit using FormData. In the formdata collection add the file and submit the form using Jquery. And in the MVC controller side you will get the File in HttpFileCollectionBase. Please refer below url for more information. http://www.c-sharpcorner.com/UploadFile/manas1/upload-files-through-jquery-ajax-in-Asp-Net-mvc/

Rajeesh Menoth · Answer

Hi, Please check the following reference : http://www.c-sharpcorner.com/UploadFile/manas1/upload-files-through-jquery-ajax-in-Asp-Net-mvc/ http://www.c-sharpcorner.com/UploadFile/sourabh_mishra1/fileupload-in-Asp-Net-mvc/

MVC file upload

Answers (7)