آپلود فایل با استفاده از JQuery AJAX در MVC

آقای مدائنی میشه این قسمت از کد سایتتون رو در اختیار کاربران قرار بدید, خیلی سعی کردم ولی نتونستم مثل کد شما بنویسم

من مشکلم دیروز همین بود که با کمک  مهندس مدائنی حل شد

به این پست توجه کنید

برای نمایش تصاویر انتخابی بصورت زیر عمل کنید

اسم fileUpload رو بذارین ProFile مثلا

$("#ProFile").change(function () {
            readURL(this);
        });

اینم تابع readURL

function readURL(input) {

        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#ProfilePreview').attr('src', e.target.result);
            }

            reader.readAsDataURL(input.files[0]);
        }
    }

اسم image رو من اینجا ProfilePreview گذاشتم

آقای نوروزی میخام که عکس زمانی که انتخاب میشه به سرور ارسال بشه و همزمان بدونه رفرش شدن صفحه نمایش داده بشه

کدی که اقای مدائنی برای سایتشون نوشتند خیلی عالیه اگه میتونن در اختیار کاربران هم قرارش بدن

کدی که بالا دادم برای نمایش همزمان عکس انتخابیه!

حالا شما بعد از ReadURL(this یه تابع دیگه فراخوانی کن

توی این تابع با Ajax عکس رو آپلود کن

کد سمت کنترلر:

  [HttpPost]
        public ActionResult UploadFiles()
        {
            string ResultFile=null;
            // Checking no of files injected in Request object  
            if (Request.Files.Count > 0)
            {
                try
                {
                    //  Get all files from Request object  
                    HttpFileCollectionBase files = Request.Files;
                    for (int i = 0; i < files.Count; i++)
                    {
                        string path = AppDomain.CurrentDomain.BaseDirectory + "ProfessorProfilePic/";  
                        //string filename = Path.GetFileName(Request.Files[i].FileName);  

                        HttpPostedFileBase file = files[i];
                        string fname;

                        // Checking for Internet Explorer  
                        if (Request.Browser.Browser.ToUpper() == "IE" || Request.Browser.Browser.ToUpper() == "INTERNETEXPLORER")
                        {
                            string[] testfiles = file.FileName.Split(new char[] { '\\' });
                            fname = testfiles[testfiles.Length - 1];
                            ResultFile = fname;
                        }
                        else
                        {
                            Guid Privateid = Guid.NewGuid();
                            fname = Privateid+file.FileName;
                            ResultFile = fname;
                        }

                        // Get the complete folder path and store the file inside it. 
                        fname = Path.Combine(Server.MapPath("~/ProfessorProfilePic/"), fname);
                        file.SaveAs(fname);
                    }
                    // Returns message that successfully uploaded  
                    return Json(ResultFile);
                }
                catch (Exception ex)
                {
                    return Json("Error occurred. Error details: " + ex.Message);
                }
            }
            else
            {
                return Json("No files selected.");
            }
        }  

کد Ajax مربوط به آپلود :

  function RunUpload(){
            // Checking whether FormData is available in browser  
            if (window.FormData !== undefined) {  
   
                var fileUpload = $("#FileUpload1").get(0);  
                var files = fileUpload.files;  
               
                // Create FormData object  
                var fileData = new FormData();  
   
                // Looping over all files and add it to FormData object  
                for (var i = 0; i < files.length; i++) {  
                    fileData.append(files[i].name, files[i]);  
                }  
               
                // Adding one more key to FormData object  
                fileData.append('ProfessorID','kaveh');  
   
                $.ajax({  
                    url: '/Professor/UploadFiles',  
                    type: "POST",  
                    contentType: false, // Not to set any content header  
                    processData: false, // Not to process data  
                    data: fileData,  
                    success: function (result) {  
                     
                        $("#UserImageAddress").val(result);
                       
                        alert("عکس با موفقیت ارسال شد");  
                    },  
                    error: function (err) {  
                        
                        alert(err.statusText);  
                    }  
                });  
            } else {  
                alert("FormData is not supported.");  
            }  
            
        } 
        $("#btnUpload").click(function(){
            RunUpload();
        })
        function readURL(input) {

            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    $('#ProfilePreview').attr('src', e.target.result);
                }

                reader.readAsDataURL(input.files[0]);
            }
        }