Using Ajax Uploader in ASP.Net MVC

download

The following guide shows the steps to implement the Ajax Uploader Control into ASP.NET MVC(Razor). If you haven't downloaded the software, please download it from here.

1. Install the assembly

a. Copy the assembly and license file (CuteWebUI.AjaxUploader.dll, AjaxUploader.lic) to your application bin folder.

b. Copy UploadHandler.ashx to your MVC site.

2. Add Uploader httpModule to web.config's httpModules list

To allow Ajax Uploader to handle upload requests, you need to add its HttpModule to your application.

IIS Classic mode

<configuration>
  <system.web>
    <httpModules>
      <add name="CuteWebUI.UploadModule" type="CuteWebUI.UploadModule,CuteWebUI.AjaxUploader"/>
     </httpModules>
  </system.web>
</configuration>

IIS Integrated mode

<configuration>
  <system.webServer>
    <modules>
      <add name="CuteWebUI.UploadModule" type="CuteWebUI.UploadModule,CuteWebUI.AjaxUploader"/>
    </modules>
  </system.webServer>
</configuration>

3. Using the Uploader in a MVC page

a. Register Uploader control in MVC Controller

using (CuteWebUI.MvcUploader uploader = new CuteWebUI.MvcUploader(System.Web.HttpContext.Current))
{
    uploader.UploadUrl = Response.ApplyAppPathModifier("~/UploadHandler.ashx");
    uploader.Name = "myuploader";
    uploader.AllowedFileExtensions = "*.jpg,*.gif,*.png,*.bmp,*.zip,*.rar";
    uploader.InsertText = "Select a file to upload";
    ViewData["uploaderhtml"] = uploader.Render();
}

b. Insert an Uploader instance into the MVC page

@{Html.BeginForm();}
   @Html.Raw(ViewBag.uploaderhtml)
@{Html.EndForm();}