در این مقاله نحوه آپلود چند فایل همزمان با Drag & Drop با استفاده از AjaxFileUpload در Asp.Net را شرح خواهیم داد

کنترل AjaxFileUpload به کاربران اجازه میدهد که چندین فایل را برای بارگزاری و ارسال به سمت سرور انتخاب نماییم .همچنین این کنترل به کاربران این امکان را میدهد که با Drag and Drop فایل های مورد نظر خود را مستقیم از پوشه دلخواه به محل مورد نظر ارسال کند .

کنترل مربوط به Ajax :

از این لینک میتوانید آخرین نسخه کنترل Ajax را دانلود نمایید .

افزودن فضای نام مربوط به AJAX Control در پروژه :

هنگامی که یکبار به پروژه کتابخانه را اضافه می کنیم .آنرا از حالت فشرده خارج و reference آنرا در پروژه خود قرار می دهیم .یکبار پروژه را Build می کنیم سپس با استفاده از تگ زیر کنترل مربوط به Ajax را در پروژه خود قرار میدهیم

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

تگ های مربوط به صفحه که شامل ToolkitScriptManager و یک کنترل AjaxFileUpload میباشد را به پروژه اضافه می کنیم :

<asp:ToolkitScriptManager runat="server">
</asp:ToolkitScriptManager>
<asp:AjaxFileUpload ID="AjaxFileUpload11" runat="server" MaximumNumberOfFiles="5"
    Width="400px" OnUploadComplete="OnUploadComplete" />

سپس فضای نام مورد نظر را باید به صفحه اضافه کنیم :

#C :

using System.IO;
using AjaxControlToolkit;

VB.Net :

Imports System.IO
Imports AjaxControlToolkit

رویداد OnUploadCpmplete  :

این رویداد هنگامی اجرا میشود که file upload تکمیل شده باشد و نام فایلها با استفاده از رویداد AjaxFileuploadEventArgs  و فایل انتخاب شده با استفاده از متد SaveAs در پوشه ای که در پروژه قرار داده ایم ذخیره میشود .

#C :

protected void OnUploadComplete(object sender, AjaxFileUploadEventArgs e)
{
    string fileName = Path.GetFileName(e.FileName);
    AjaxFileUpload11.SaveAs(Server.MapPath("~/Uploads/" + fileName));
}

VB.Net :

Protected Sub OnUploadComplete(sender As Object, e As AjaxFileUploadEventArgs)
    Dim fileName As String = Path.GetFileName(e.FileName)
    AjaxFileUpload1.SaveAs(Server.MapPath("~/Uploads/" & fileName))
End Sub

پیکربندی Web.Config :

سپس باید Handler را در قسمت System.Web و System.WebServer قسمت اضافه میکنیم :

کد مربوط به IIS6 و ویژوال استودیو نسخه 2010 :

<system.web>
    <httpHandlers>
        <add verb="*POST" path="AjaxFileUploadHandler.axd" type="AjaxControlToolkit.AjaxFileUploadHandler, AjaxControlToolkit"/>
    </httpHandlers>
</system.web>

کد مربوط به IIS7 و ویژوال استودیو نسخه 2012 و قبل :

<system.webServer>
    <handlers>
        <add name="AjaxFileUploadHandler" verb="POST" path="AjaxFileUploadHandler.axd" type="AjaxControlToolkit.AjaxFileUploadHandler, AjaxControlToolkit"/>
    </handlers>
</system.webServer>