当我向代码添加ajax时图像不保存

Question

I have a simple PHP file upload script like so ,

<?php

    $path = 'uploads/';
    $file_ext   = array('jpg','png','gif','bmp','JPG');
    $post_ext   = end(explode('.',$_FILES['photo']['name']));
    $photo_name = $_FILES['photo']['name'];
    $photo_type = $_FILES['photo']['type'];
    $photo_size = $_FILES['photo']['size'];
    $photo_tmp  = $_FILES['photo']['tmp_name'];
    $photo_error= $_FILES['photo']['error'];
    //move_uploaded_file($photo_tmp,"uploads/".$photo_name);

    echo $photo_tmp;

    if((($photo_type == 'image/jpeg') || ($photo_type == 'image/gif')   ||
       ($photo_type == 'image/png') || ($photo_type == 'image/pjpeg')) &&
       ($photo_size < 2000000) && in_array($post_ext,$file_ext)) {

        /* Understand in-Array !! */

        if($photo_error > 0 ){
            echo 'Error '.$photo_error;
            exit;
        }else{
            echo $photo_name.' Uploaded !';
        }
        if(file_exists($path.$photo_name)){
            echo 'There is '.$photo_name;
        }else{
            //new photo name and encryption
            $new_name = explode('.',$photo_name);
            $photo_name = 'erkan_'.md5($new_name[0]).'.'.$new_name[1];

            //move to directory
            if(move_uploaded_file($photo_tmp,$path.$photo_name)){

                return $photo_name;
            }
        }
    }

?>

The form code:

<form action="fileupload.php" method="post" enctype="multipart/form-data">
            <input type="file" name="photo" id="fileBox">
            <button type="submit">SUBMIT</button>

Using the above script my file gets saved perfectly fine , but when i add a little ajax to the mix , like so:

$(function(){
    $('button[type="submit"]').on('click' , function(e){
        e.preventDefault();
        var formData = new FormData();
        formData.append('photo', $('input[type=file]')[0].files[0]); 
        $.ajax({
            url: 'fileupload.php',
            data: formData,
            // THIS MUST BE DONE FOR FILE UPLOADING
            contentType: false,
            processData: false,
            // ... Other options like success and etc
        });
    });
});

Now when i upload an image the image is not saved in my uploads folder , WHY ?

Answer 1

You missed, type: "POST", in your <script></script> tag.

$(function(){
    $('button[type="submit"]').on('click' , function(e){
        e.preventDefault();
        var formData = new FormData();
        formData.append('photo', $('input[type=file]')[0].files[0]); 
        $.ajax({
            type: "POST",  
            url: 'fileupload.php',
            data: formData,
            // THIS MUST BE DONE FOR FILE UPLOADING
            contentType: false,
            processData: false,
            // ... Other options like success and etc
        });
    });
});