PDA

View Full Version : حرفه ای: آپلود عکس با ایجکس



numberone1
چهارشنبه 16 اسفند 1391, 17:50 عصر
سلام

میخوام عکس آپلود کنم بصورت ایجکسی فقط نمیخوام از فرم استفاده کنم


<input type="file" size="30" name = "pic" id="pic"/>

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

توی اینترنت خیلی گشتم لطفا لینک آموزشی نزارین لینک پلاگین آماده هم نزارید نمیخوام چند صد کیلو بایت دیگه به برنامه اضافه کنم واسه آپلود

eshpilen
چهارشنبه 16 اسفند 1391, 22:41 عصر
با ایجکس نمیشه فایل منتقل کرد مشکل اینه
اگر مرورگرهای قدیمی رو بیخیال بشید با خیلی از مرورگرهای جدیدتر با ایجکس هم میشه فایل آپلود کرد.
ساپورت مرورگرهای مختلف: http://caniuse.com/fileapi
فایرفاکس و کروم ساپورت کامل دارن حتی از نسخه های نسبتا قدیمیشون.
IE فقط نسخهء 10 ساپورت میکنه.
Opera از نسخهء 11.1 ساپورت داره.
ولی مرورگرهای خاصتر مثل نسخه های موبایل وضعشون زیاد جالب نیست.
البته شما میتونید از دو مکانیزم برای آپلود فایل استفاده کنید برحسب نوع مرورگر که شناسایی میکنید.
یک ترفند قدیمی که برای آپلود فایل با ظاهر ایجکس استفاده میکردن، ست کردن target تگ فرم به یک فریم داخلی (iframe) پنهان است تا جاییکه یادمه؛ اینطور سابمیت فرم و آپلود فایل در اون فریم داخلی پنهان انجام میشه و صفحهء اصلی ثابت میمونه.

numberone1
چهارشنبه 16 اسفند 1391, 22:59 عصر
اگر مرورگرهای قدیمی رو بیخیال بشید با خیلی از مرورگرهای جدیدتر با ایجکس هم میشه فایل آپلود کرد.
ساپورت مرورگرهای مختلف: http://caniuse.com/fileapi
فایرفاکس و کروم ساپورت کامل دارن حتی از نسخه های نسبتا قدیمیشون.
IE فقط نسخهء 10 ساپورت میکنه.
Opera از نسخهء 11.1 ساپورت داره.
ولی مرورگرهای خاصتر مثل نسخه های موبایل وضعشون زیاد جالب نیست.
البته شما میتونید از دو مکانیزم برای آپلود فایل استفاده کنید برحسب نوع مرورگر که شناسایی میکنید.
یک ترفند قدیمی که برای آپلود فایل با ظاهر ایجکس استفاده میکردن، ست کردن target تگ فرم به یک فریم داخلی (iframe) پنهان است تا جاییکه یادمه؛ اینطور سابمیت فرم و آپلود فایل در اون فریم داخلی پنهان انجام میشه و صفحهء اصلی ثابت میمونه.
تا جائی که سرچ میکردم زده بود ie 8 به بالا ساپورت میکنه
ولی به هر حال الان مشکلم اینه . این کد و ببین تا بیشتر توضیح بدم


<script type="text/javascript">
$(document).ready(function()
{
$('#pic').live('change', function()
{
var pic = $('#pic').val();
$.ajax({
type : "file",
data:{pic : pic },
url : "ajax/ajax.php",
beforeSend: function() {
$("#preview").html('<img src="loader.gif" alt="Uploading...."/>');
},
success : function(data){
$("#imgpreview").slideDown();

$("#imgpreview").html(data);
}
});
});
});
</script>

<input type="file" size="30" name = "pic" id="pic"/>

چیزی که پست میشه برای صفحه php محتویات این فیلد از نوع فایل نیست بلکه فقط یه عدد هست
فایل و نمیشه با ajax ارسال کرد
حالا چه type : "file", باشه چه type : "POST", یا اینکه type : "GET", باشه فرقی نمیکنه
مسئله اینه که من نمیتونم عکس اونور بگیرم و آپلود کنم
واسه این مشکل سلوشنی داری بگو؟


$name = $_FILE['pic']['name'];
$size = $_FILE['pic']['size'];

eshpilen
چهارشنبه 16 اسفند 1391, 23:09 عصر
من از jquery استفاده نکردم تاحالا و وارد نیستم.
میتونی از کدهای نمونه جاوااسکریپت مستقیم که توی نت هست استفاده کنی خب.

numberone1
چهارشنبه 16 اسفند 1391, 23:17 عصر
من از jquery استفاده نکردم تاحالا و وارد نیستم.
میتونی از کدهای نمونه جاوااسکریپت مستقیم که توی نت هست استفاده کنی خب.
میشه نمونه بذاری اگر داری از جاوا اسکریپت؟
با jquery هم نه که نشه کلا , میشه ولی باید حتما فیلد آپلود عکس توی فرم باشه با پلاگین فرم jquery ارسالش کنی که این فیلد با تعداد زیادی دیگه خودشون توی یک فرم هستند و نمیشه دوباره برای این 1 دونه یه فرم جدا تعریف کنم!!!
هر چی هم نمونه دیدم با همین روش بود!!