CODEWITHSUNDEEP
asp.net-mvc-3c#-4.0jqueryfile-uploadprogress-bar
yohan.jayarathna
yohan.jayarathna

Reputation: 3453

.net MVC 3.0 file upload with progress bar

I saw there are similar question to this. But I couldn't find an answer. That's why I am posting this again. Sorry!!

I want to build a file uploader with percentage bar with in it using .net mvc 3.0

There are some jquery plugins. But they need html 5 support. I am trying to build it without html 5 support.

Currently what I do is upload files with Ajax support. When file is uploaded by user I make an ajax request and display loading.gif until requested completed. So it is a pretty strait forward code for simple image uploads.

Now I am trying to upload videos and send it to Vimeo through their REST APIs.

I could do the same thing. But since files are large I want to do it in a nice way.

My code is something like this

View

@using (Ajax.BeginForm("Upload", "Home", new AjaxOptions
                        {
                            UpdateTargetId = "form1",
                            InsertionMode = InsertionMode.Replace,
                            OnBegin = "ajaxValidate",
                            OnSuccess = "getGbPostSuccess",
                            OnFailure = "showFaliure"
                        }))
      //.......
      //rest of the form
}

Controller

public ActionResult Upload()
{
     //Read file 
     //Post file to Vimeo (this is the part that take time to upload)
     //get uploaded video content
     return PartialView("xxxxx", Model); // return uploaded Video
}

I display a loading.gif using a small piece of javascript while this process happening. This code is working absolutely fine. As I mention before I want to make it more user friendly by putting a percentage progress bar.
Hope my question is clear.

Please help me...

Thanks in advance

Upvotes: 1

Views: 5124

Answers (1)

Darin Dimitrov
Darin Dimitrov

Reputation: 1038730

But they need html 5 support.

Not necessary. For example the blueimp file upload plugin tests browser capabilities and could use the jQuery iframe transport if the browser doesn't support HTML5 XHR2. Here are more details about browser support.

Uploadify is another example which uses Flash if the browser doesn't suport XHR2.

Plupload is yet another very powerful plugin which supports a multitude of equivalents if the browser doesn't support XHR2.

So just pick a plugin, read the documentation, integrate it in your ASP.NET MVC 3 application and have fun.

Upvotes: 3

Related Questions