PDA

View Full Version : پيش نمايش عکس آپلود شده بدون رفرش صفحه و بدون Ajax Control Toolkit



bftarane
شنبه 04 آذر 1391, 15:32 عصر
سلام.
من مي خوام عکسي که کاربر در کنترل فايل آپلود انتخاب مي کنه با زدن يه دکمه ابتدا اون عکس در يک کنترل ايميج نشون داده بشه.
خوب من اين کار رو تونستم انجام بدم.
يعني آدرس عکس رو مي گيرم و به خاصيت ImageUrl کنترل Image نسبت مي دم ولي مي خوام اين کار بدون رفرش صفحه انجام بشه.
سرچ زياد زدم.
دو تا نمونه پيدا کردم که ظاهراً يکي شون با IE و ديگري( AsyncFileUpload control که
AJAX Control Toolkit بايد استفاده بشه ) با نسخه 4 مرورگر FF مشکل دارن.

نمي دونم شما راه بهتري سراغ داريد.
من به ذهن خودم رسيده بود که فقط کنترل image رو در يک Update Panel بندازم که فکر مي کنم چون من کدهام رو در يک يوزر کنترل نوشتم جواب نميده شايدم اصلاً دارم اشتباه مي کنم.

لطفاً راهنمايي کنيد.

hamed_hossani
یک شنبه 05 آذر 1391, 00:48 صبح
http://upcity.ir/images/44581977986520100632.jpg
http://www.htmldrive.net/items/show/1235/jQuery-Awesome-File-Upload-effect
متاسفانه قی لتر است با پرک سی باز کنید
Features
•Multiple file upload:
Allows to select multiple files at once and upload them simultaneously.
•Drag & Drop support:
Allows to upload files by dragging them from your desktop or filemanager and dropping them on your browser window.
•Upload progress bar:
Shows a progress bar indicating the upload progress for individual files and for all uploads combined.
•Cancelable uploads:
Individual file uploads can be canceled to stop the upload progress.
•Resumable uploads:
Aborted uploads can be resumed with browsers supporting the Blob API.
•Chunked uploads:
Large files can be uploaded in smaller chunks with browsers supporting the Blob API.
•Client-side image resizing:
Images can be automatically resized on client-side with browsers supporting the required JS APIs.
•Preview images:
A preview of image files can be displayed before uploading with browsers supporting the required JS APIs.
•No browser plugins (e.g. Adobe Flash) required:
The implementation is based on open standards like HTML5 and JavaScript and requires no additional browser plugins.
•Graceful fallback for legacy browsers:
Uploads files via XMLHttpRequests if supported and uses iframes as fallback for legacy browsers.
•HTML file upload form fallback:
Shows a standard HTML file upload form if JavaScript is disabled.
•Cross-site file uploads:
Supports uploading files to a different domain with Cross-site XMLHttpRequests.
•Multiple plugin instances:
Allows to use multiple plugin instances on the same webpage.
•Customizable and extensible:
Provides an API to set individual options and define callBack methods for various upload events.
•Multipart and file contents stream uploads:
Files can be uploaded as standard "multipart/form-data" or file contents stream (HTTP PUT file upload).
•Compatible with any server-side application platform:
Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads.

Browser Support (tested versions)
• Google Chrome - 7.0+
• Apple Safari - 4.0+
• Mozilla Firefox - 3.0+
• Opera - 10.0+
• Microsoft Internet Explorer 6.0+

bftarane
یک شنبه 05 آذر 1391, 19:14 عصر
سلام.
بچه ها لطفاً لينک زير رو ببينيد
http://www.codeproject.com/Articles/16945/Simple-AJAX-File-Upload
من خيلي از اين روش خوشم اومده. ولي متأسفانه امتحان کردم براي من جواب نداد. اومده UpdatePanel و تريگر استفاده کرده.
منتها يه خاصيتي اونجا براي يکي از کنترلهاي مورد استفاده استفاده کرده يعني
UsingUpdatePanel="True"
که من خواستم اون رو براي Image ست کنم نمي شناختش.
اگه کسي اين روش رو بلده لطفاً در ميون بزاره.

hamed_hossani
دوشنبه 06 آذر 1391, 00:07 صبح
فکر میکنم در این روش
datePiker,label,button,fileupload رو در یک updatepanel گذاشته و با استفاده از PostBackTrigger دکمه را از updatePanel مستثنا کرده و پست بک بشه داده!
http://upcity.ir/images/06603119089182795505.gif

bftarane
دوشنبه 06 آذر 1391, 05:56 صبح
بله درسته همين کار رو کرده ولي من اومدم در کدهاي خودم از اين روش عمل کردم و سعي کردم چه جوري بگم رفتاري که با DatePicker شده رو با Image انجام بدم
ولي عکسي در پوشه آپلود نميشد.
يه مسئله اي که بود ديدم کنترل Image اون خاصيت UsingUpdatePanel رو نميشناسه.
ديگه نمي دونم ايراد از کجاي کار من بود.
در هر صورت من بعد از کلي سرچ زدن مجبور شدم از Ajax Toolkit استفاده کنم و بعد از اجرا از نتيجه بدم هم نيومد حالا بايد برم سراغ resize شدن و Validation عکس (ماکزيمم سايز و اندازه و پسوند) ببينم فرقي با روش استفاده از FileUpload معمولي داره يا نه؟
ممنون. اون سوال رو هم فکر کنم فقط اگه کسي امتحان کنه متوجه ميشه جواب ميده يا نميده.