خانه مقالات 123 کدنویسی خدمات دانلود پشتیبانی تماس با ما درباره ما

آپلود فایل با ای جکس ساده

[short_link]

راهنمای آپلود فایل با ای جکس

با استفاده از جی کوئری و ای جکس میشه یه فایل رو بدون اینکه صفحه رو رفرش کنیم ، فایل مورد نظر خودمون رو آپلود کنیم و از این روش، در فرم های خودمون استفاده کنیم . مثلا در فرم های تماس با ما و یا فرم های مختلف که نیاز به ارسال فایل و یا اسکرین شات باشه می تونیم از این فرم ای جکس استفاده کنیم .

این قسمت مربوط به فرم اصلی هست :

<!DOCTYPE html>
<html>
<head>
    <title>Image Upload Form</title>
    <script src="//code.jquery.com/jquery-1.9.1.js"></script>
    <script type="text/javascript">
        function submitForm() {
            console.log("submit event");
            var fd = new FormData(document.getElementById("fileinfo"));
            fd.append("label", "WEBUPLOAD");
            $.ajax({
              url: "upload.php",
              type: "POST",
              data: fd,
              processData: false,  // tell jQuery not to process the data
              contentType: false   // tell jQuery not to set contentType
            }).done(function( data ) {
                console.log("PHP Output:");
                console.log( data );
            });
            return false;
        }
    </script>
</head>

<body>
    <form method="post" id="fileinfo" name="fileinfo" onsubmit="return submitForm();">
        <label>Select a file:</label><br>
        <input type="file" name="file" required />
        <input type="submit" value="Upload" />
    </form>
    <div id="output"></div>
</body>
</html>

برای قسمت دریافت اطلاعات ارسالی فرم توسط ای جکس نیاز به یک فایل داریم که اسمش رو میزاریم upload.php
و این کد رو توش کپی می کنیم :

<?php
if ($_POST["label"]) {
    $label = $_POST["label"];
}
$allowedExts = array("gif", "jpeg", "jpg", "png");
$temp = explode(".", $_FILES["file"]["name"]);
$extension = end($temp);
if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/jpg")
|| ($_FILES["file"]["type"] == "image/pjpeg")
|| ($_FILES["file"]["type"] == "image/x-png")
|| ($_FILES["file"]["type"] == "image/png"))
&& ($_FILES["file"]["size"] < 200000)
&& in_array($extension, $allowedExts)) {
    if ($_FILES["file"]["error"] > 0) {
        echo "Return Code: " . $_FILES["file"]["error"] . "<br>";
    } else {
        $filename = $label.$_FILES["file"]["name"];
        echo "Upload: " . $_FILES["file"]["name"] . "<br>";
        echo "Type: " . $_FILES["file"]["type"] . "<br>";
        echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>";
        echo "Temp file: " . $_FILES["file"]["tmp_name"] . "<br>";

        if (file_exists("uploads/" . $filename)) {
            echo $filename . " already exists. ";
        } else {
            move_uploaded_file($_FILES["file"]["tmp_name"],
            "uploads/" . $filename);
            echo "Stored in: " . "uploads/" . $filename;
        }
    }
} else {
    echo "Invalid file";
}
?>

در کنار این فایل ها نیاز داریم که یه فولدر به نام uploads ایجاد کنیم که فایل ها اونجا آپلود میشن.

(0) دیدگاه برای این پست ثبت شده
دیدگاه خود را بفرستید
  1. اولین نفری باشید که دیدگاه خود را ثبت می کند!
« کد نمایش تعداد موجودی کالا در ووکامرس
کد اضافه کردن بارکد با php »
با کلیک بر روی هر کدام از کلمات می توانید مطالب مشابه را مشاهده کنید:

Ajax

آپلود فایل

آپلودر

ای جکس