آموزش آپلود فایل با AJAX

آموزش آپلود فایل با AJAXReviewed by همیار پروژه on Jul 29Rating: 5.0آموزش آپلود فایل با AJAXآموزش آپلود فایل با AJAX

آموزش آپلود فایل با AJAX

آموزش آپلود فایل با AJAX

آپلود فایل در سرور با استفاده از تکنیک AJAX

با آموزش آپلود فایل با AJAX در خدمت شما عزیزان هستیم . در این آموزش با استفاده از کنترل AsyncFileupload در Ajax Control Toolkit می خواهیم فایل ها را به صورت آسنکرون آپلود نماییم . این مثال کنترل جدید AsyncFileUpload را معرفی می کند، کنترلی که می تواند بدون postback و reload صفحه فایل ها را به صورت آسنکرون آپلود کند.

 

پیشنهاد ویژه : دانلود کتاب های آموزش ایجکس AJAX به زبان فارسی

 

آموزش آپلود فایل با AJAX :

در ابتدا باید آخرین ورژن کتابخانه AJAX Control Toolkit را دانلود کنید :

جهت دانلود از لینک زیر استفاده کنید

ASP.Net AJAX Control Toolkit

 

اضافه کردن رفرنس به پروژه :

بعد از اینکه کتابخانه AJAX Control Toolkit را دانلود کرده و از حالت فشرده خارج کردیم، رفرنس آن را به پروژه اضافه کرده و Build می کنیم.
زمانی که رفرنس را اضافه کردیم، تگ زیر را نیز به Web page خود اضافه می کنیم.

 

کار با کنترل AsyncFileUpload :

بعد از اضافه کردن تگ، می توانیم کنترل AsyncFileUpload را به صورت زیر به صفحه اضافه کنیم.

 

رویدادهای کنترل AsyncFileUpload :

property نوع اهمیت
onClientUploadError کلاینت زمانی رخ میدهد که آپلود فایل دچار خطا شود.
onClientUploadComplete کلاینت زمانی رخ میدهد که آپلود فایل با موفقیت انجام شود.
onUploadComplete سرور زمانی رخ میدهد که آپلود فایل با موفقیت انجام شود.

پیشنهاد ویژه :   نسخه PRO افزونه WPtouch + تم ها و افزونه ها
property نوع اهمیت
onClientUploadError کلاینت زمانی رخ میدهد که آپلود فایل دچار خطا شود.
onClientUploadComplete کلاینت زمانی رخ میدهد که آپلود فایل با موفقیت انجام شود.
onUploadComplete سرور زمانی رخ میدهد که آپلود فایل با موفقیت انجام شود.

 

مدیریت رویداد سمت سرور :

حال برای رویداد سمت سرور onUploadedcomplete می توانیم به صورت زیر عمل کنیم:

سی شارپ

 

VB.Net

همان طور که مشاهده می کنید، به همان صورت که قبلا در کنترل FileUpload عمل می کردیم فایل را در فولدری با نام Upload در ریشه پروژه ذخیره کردیم.

 

مدیریت رویدادهای سمت کلاینت :

مشابه رویدادهای سمت سرور، می توان رویدادهای سمت کلاینت را نیز به شکل زیر کنترل کرد:

همان طور که می بینید، تابع uploadcomplete و uploadError را به ترتیب در رویدادهای onClientUploadComplete و onClientUploadError کنترل AsyncFileUpload فراخوانی کردیم.

براساس اینکه آپلود با موفقیت انجام شده یا خیر، رویداد مناسب فراخوانی می شود.

 

انیمیشن Loading :

برای نمایش انیمیشن Loading، در زمان شروع آپلود باید یک کنترل image برای نمایش فایل GIF اضافه کنیم. ID مربوط به کنترل Image را باید با استفاده از ThrobberID property مربوط به کنترل AsyncFileUpload مشخص کنیم.

 

موفق باشید !

همیار پروژه AJAX آموزش AJAX

دیدگاه خود را بیان کنید