در ارتباط با همین مطلب بخوانید



آپلود چند فایل بصورت Drag and Drop بوسیله Jquery و Html5 - جی کوئری


تاریخ : یکشنبه,۱۹ دی ۱۳۹۵ تعداد بازدید :777

اگر شما می خواهید فایل های خود را بوسیله کشیدن و رها کردن آپلود کنید می توانید نگاهی به این پست بندازید.شما می توانید با استفاده از jquery و php چندین فایل را روی سرور آپلود نمایید.این اسکریپت به شما کمک می کند که برنامه های کاربردی خود را غنی تر بسازید. این کد تنها در مرورگرهای مدرن چون Crome, Firefox و  Safariبه خوبی کار می کند.

شما باید ابتدا کتابخانه multiupload.js را به ابتدا کد خود اضافه نمایید.

کد جاوااسکریپت

<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript" src="js/multiupload.js"></script>
<script type="text/javascript">
var config = {
// Valid file formats
support : "image/jpg,image/png,image/bmp,image/jpeg,image/gif", 
form: "demoFiler", // Form ID
dragArea: "dragAndDropFiles", // Upload Area ID
uploadUrl: "upload.php" // Server side file url
}
//Initiate file uploader.
$(document).ready(function()
{
initMultiUploader(config);
});
</script>

صفحه Upload.php

 

if($_SERVER["REQUEST_METHOD"] == "POST")
{
if(move_uploaded_file($_FILES["file"]["tmp_name"], "uploads/".$_FILES["file"]["name"]))
{
echo($_POST["index"]); // to validate 
}
exit;
}

کد HTML5 

فرم Html5 برای درگ اند دراپ

<div id="dragAndDropFiles" class="uploadArea">
<h2>Drop Images Here</h2>
</div>
<form name="demoFiler" id="demoFiler" enctype="multipart/form-data">
<input type="file" name="multiUpload" id="multiUpload" multiple />
<input type="submit" name="submitHandler" id="submitHandler" value="Upload" />
</form>
<div class="progressBar">
<div class="status"></div>
</div>


منبع: پورتال پادرا

برچسب ها :





این مقاله را دوست داشتید؟ آنرا به اشتراک بگذارید



دیدگاه خودتان را ارسال کنید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز با * علامت گذاری شده اند.






star TOP 10

  • مقالات
  • بیمارستان
  • دکتر
  • دارو


مطالب این سایت تنها جنبه اطلاع رسانی و آموزشی داشته و توصیه پزشکی تخصصی تلقی نمی شوند و نباید آنها را جایگزین مراجعه به پزشک جهت تشخیص و درمان دانست.
هشدار! تجويز و تعيين دوز دارو به عهده پزشک مي باشد و پورتال پادرا هيچگونه مسئوليتي در خصوص مصرف خود سرانه دارو ندارد