Smiley face

عنوان : آپلود تصویر بدون رفرش صفحه با استفاده از آژاکس، جی کوئری و پی اچ پی

1396/11/07 - 16:12:18
Upload Image Without Page Refresh Using Ajax,jQuery And PHP


آپلود تصویر بدون رفرش صفحه با استفاده از آژاکس، جی کوئری و پی اچ پی

Upload Image Without Page Refresh Using Ajax,jQuery And PHP

 

در این آموزش ما به شما نحوه آپلود تصویر بدون رفرش صفحه با استفاده از ajax، jQuery و PHP را نشان خواهیم داد. اما قبل از ادامه باید پلاگین jQuery و jQuery را دانلود کنید که مهمترین کار برای آپلود تصویر بدون refresh است.

 

ajax_image_upload

 

برای آپلود تصویر بدون صفحه تازه کردن فقط یک مرحله را طی می کند:
1.  یک فایل PHP ایجاد کنید و نشانه گذاری و اسکریپت را تعریف کنید.


مرحله 1. یک فایل پی اچ پی ایجاد کنید و نشانه گذاری و اسکریپت را تعریف کنید.
ما یک فایل php ایجاد می کنیم و آن را با نام upload.php ذخیره می کنیم.

<?php
if(isset($_POST['submit_image']))
{
 $uploadfile=$_FILES["upload_file"]["tmp_name"];
 $folder="images/";
 move_uploaded_file($_FILES["upload_file"]["tmp_name"], "$folder".$_FILES["upload_file"]["name"]);
 exit();
}
?>

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>
<script>
$(document).ready(function() { 
 $('form').ajaxForm(function() { 
 }); 
});
</script>
</head>
<body>
<div id="wrapper">
 <form action="" method="post" enctype="multipart/form-data">
  <input type="file" id="upload_file" name="upload_file" />
  <input type="submit" name='submit_image' value="Upload Image"/>
 </form>
</div>
</body>
</html>

در ابتدا ما یک فرم برای آپلود تصویر ایجاد می کنیم سپس ما افزونه جی کوئری و جی کوئری را برای آپلود تصویر بدون باز کردن صفحه قرار می دهیم و سپس از تابع document.ready استفاده می کنیم تا کد ajaxform را برای هر بار که دکمه ارسال را کلیک می کند اجرا کند. هر وقت کاربر بر روی دکمه ارسال کلیک کند ارسال دکمه ajaxform آپلود تصویر را انجام داده و از به روز رسانی صفحه جلوگيري مي كند و در کد پی اچ پی ما به سادگی تصویر را با ajaxform ارسال می کنیم و به دایرکتوری تصویر آپلود می کنیم.
 

1396/11/07 - 16:12:18
برچسب هاي مطلب :



شما اولين نفري باشيد كه نظر ارسال مي كند.

فرم ثبت نظر

نام و نام خانوادگی
ایمیل
وبلاگ
نظر و کامنت
كد امنيتي