BAU - کامپوننتی برای آپلود واقعی فایل با AJAX

[Behrouz_Rad]

در سومین نسخه، بیشترین تمرکز من بر روی اضافه کردن قابلیت آپلود همزمان چند فایل بود. هر چند کار زمانبری بود اما خوشبختانه با موفقیت انجام شد. حال می توانید هر تعداد از این کامپوننت را که دوست دارید به صفحه اضافه و هر تعداد فایل که می خواهید به طور همزمان آپلود کنید.

قابلیت دیگر، اضافه کردن قالب دلخواه به بخش های مختلف این کامپوننت هست که موجب شد طرز کار اون کمی تفاوت بکنه. سه Property جدید با مقداردهی اجباری به این کامپوننت اضافه کردم به شرح ذیل:
StatControlId: این خصیصه، id یک کنترل html از نوع span یا div رو می پذیره که باید "میزان حجم آپلود شده و حجم کل فایل" در اون نمایش داده بشه. می تونید کلاس دلخواهی رو با استفاده از CSS تعریف و به تگ مورد نظر نسبت بدید تا ظاهر دلخواهی رو برای نمایش داشته باشید.
SpeedControlId: این خصیصه، id یک کنترل html از نوع span یا div رو می پذیره که باید "سرعت آپلود" در اون نمایش داده بشه. می تونید کلاس دلخواهی رو با استفاده از CSS تعریف و به تگ مورد نظر نسبت بدید تا ظاهر دلخواهی رو برای نمایش داشته باشید.
ProgressSpanId: به این خصیصه، حتما باید مقدار id یک تگ span با مقدار progressBar برای خاصیت class اون نسبت بدید. دقت داشته باشید که نیاز نیست کلاس progressBar رو با CSS تعریف کنید. این تگ span مکان قرارگیری Progress Bar رو بر روی صفحه مشخص می کنه.

مثالی از نحوه ی تعریف و استفاده از این کامپوننت با آخرین تغییرات:

            <asp:FileUpload ID="FileUploader1" runat="server" />

            <asp:Button ID="btnUpload" runat="server" Text="Upload" />

            <BAU:AjaxUploader ID="AjaxUploader1" runat="server" SpeedControlId="speed1" StatControlId="stat1"

                ProgressSpanId="pb1" ButtonName="btnUpload" FileUploadName="FileUploader1" ProgressColor="Red"

                ProgressTextFormat="Percentage" OnCompletedFunction="onCompleted" OnErrorFunction="onError">

            </BAU:AjaxUploader>

            

            <br />

            <span id="stat1"></span>

            <br />

            <span id="speed1"></span>

            <br />

            <span id="pb1" class="progressBar"></span>

موفق باشید.