Параметры метода данных для загрузки файлов с помощью jquery ajax

Question

Так что эта проблема связана с отсутствием хорошего понимания того, как метод данных функционирует при использовании ajax. Я рассмотрел большинство других вопросов об ajax, но эта часть не нажимает на меня.

В качестве примера я использую ajax для отправки данных формы (включая несколько текстовых полей и одной загрузки файла) на php. Затем скрипт сервера вставляет данные поля и файл url в sql db, а затем возвращает все эти значения в виде json-кодированного массива.

Мой текущий сценарий ajax показан ниже, и когда он запускается, все работает, кроме части загрузки файла. Файл не сохраняется на сервере, и, разумеется, URL не возвращается. Если я изменить:

data: data, 

в

data: text, 

загрузка файлов работает, файл будет сохранен, но тогда, когда массив JSON возвращается на страницу, я получаю белый экран, показывающий данные массива (он не возвращается на страницу, откуда поступают данные формы).

Почему это? Каков правильный метод данных, который позволяет загружать мои файлы и данные возвращаются на страницу, с которой она была отправлена.

$("document").ready(function() { 
$(".data-form").submit(function() { 
     var data = new FormData(); 
$.each(files, function(key, value) 
    { data.append(key, value); 
}); 
    if (confirm("\t\t\tAre you ready to sumbmit this listing?\nYou can always edit the listing after going to the menu tab - edit listing."))  { 
     $.ajax({ 
      type: "POST", 
      dataType: "json", 
      url: "add-list.php", 
      data: data, 
      processData: false, 
      contentType: false, 
      success: function(response) { 
         if (response.success) { 
          $("#modal1").modal('hide'); 
         $("#add_frame").show(); 
         $("#newbutt").show(); 
         $(".atitle").html('<a href="' + response.ad_linka + '" target="_blank">' + response.titlea + '</a>'); 
         $(".acomment").html(response.commenta); 
         $(".aaddress").html(response.addressa); 
         $(".asale-price").html(response.sale_pricea); 
         $(".alease-price").html(response.lease_pricea); 
         $(".alot-size").html(response.lot_sizea); 
         $(".abuilding-size").html(response.build_sizea); 
         $(".azoning").html(response.zoninga); 
         } 
         else { 
          console.log("An error has ocurred: sentence: " + response.sentence + "error: " + response.error); 
         } 
        }, 
        error: function() { 
         alert("An Error has ocurred contacting the server. Please contact your system administrator"); 
        } 
       }); 
     return false; 
    } 
}); 
}); 

Answer 1

Вы должны сказать JQuery, чтобы остановить обрабатывать ваши данные

 processData: false, // Don't process the files 
    contentType: false, // defaults to 'application/x-www-form-urlencoded; charset=UTF-8' 

Вы не посылала, как вы строите данные, но что-то, как это должно работать

var data = new FormData(); 
    $.each(files, function(key, value) 
     { data.append(key, value); 
    });