通过ajax将输入文件类型传递给php无法正常工作

Question

I have this function to get values from a form

$("button[name='createimport']").click(function() {
var fd = new FormData();
var files = $('#xsfile')[0].files[0];
fd.append('file',files);

var batchid = $("input[name='batchid']").val();
var yrstart = $("input[name='yrstart']").val();
var yrend = $("input[name='yrend']").val();

$.ajax({
    url:"fetch_import.php",
    method:"POST",
    data: { batchid : batchid, yrstart: yrstart, yrend: yrend, fd},
    success: function (data) {
        //show success result div
        if(data)
        {
            showSuccess();
        }
        else
        {
            showFailure();
        }

    },
    error: function () {
        //show failure result div
        showFailure();
        }
}); 
});

and a php code like this:

enter code here$bcid =  $_POST['batchid'];
$yrs =  $_POST['yrstart'];
$yrg =  $_POST['yrend'];

/* Getting file name */
$filename = $_FILES['file']['name'];

/* Location */
$location = "upload/".$filename;
$FileType = pathinfo($location,PATHINFO_EXTENSION);
move_uploaded_file($_FILES['file']['tmp_name'],$location);

passing the file doesn't work. I've searched for this but still not working for me, i think i'll understand how it will work. Any idea? Tyia

Answer 1

You should append your fields to fd and simply use that as data-parameter in $.ajax:

$("button[name='createimport']").click(function() {
    var fd = new FormData();
    var files = $('#xsfile')[0].files[0];
    fd.append('file',files);

    fd.append('batchid', $("input[name='batchid']").val());
    fd.append('yrstart', $("input[name='yrstart']").val());
    fd.append('yrend', $("input[name='yrend']").val());

    $.ajax({
        url:"fetch_import.php",
        method:"POST",
        data: fd,
        success: function (data) {
            //show success result div
            if(data)
            {
                showSuccess();
            }
            else
            {
                showFailure();
            }

        },
        error: function () {
            //show failure result div
            showFailure();
            }
    }); 
});