php ajax文件上传问题

Question

I have a form with various inputs and a file input for uploading 1 image. I am using ajax to post the data. When I submit, I get a console error that says

Undefined index: file

Before making it more secure, I am just trying to get it to actually upload the file.

$target_dir = "../img/";
$target_file = $target_dir . basename($_FILES["file"]["name"]);


if (move_uploaded_file($_FILES["file"]["tmp_name"], $target_dir.$_FILES['file']['name'])) {
    $status = 1;
}

jQuery

$('form').submit(function(e){
    e.preventDefault();
    var form = $( "#form1" ).serialize();
    $(".alert").hide();
    $.ajax({
        url: 'functions/add-news-ajax.php',
        type: 'POST',
        dataType: 'json',
        data: form,

        beforeSend: function() {
            $( "#btn-add" ).hide();
            $( "#loader" ).show();
        },
    })

    .done(function (data) {
        if(!data.success) {
        // validation messages etc.. 

Answer 1

I'm afraid you won't be able to send your image through serialize

var form = $( "#form1" ).serialize();

Try this :

 $('form').submit(function(e){
    e.preventDefault();
    //var form = $( "#form1" ).serialize();
    var form = new FormData($(this));
    (...)

where $this is your form element.