jQuery - DataTables 使用 ajax 上传文件答案

【问题标题】：jQuery - DataTables upload file using ajaxjQuery - DataTables 使用 ajax 上传文件
【发布时间】：2016-05-31 17:18:07
【问题描述】：

我正在使用插件datatable 来显示用户列表。在此列表中，我需要能够上传新文件。

我正在尝试使用 ajax 来尝试将数据发送到 php。如果我发送值没有问题，但是我的 php 脚本可以工作，但我无法从文件中获取数据。

为了上传文件，我使用的是我为另一个工作正常的项目编写的相同脚本，所以我认为这里的问题是 DataTable 无法识别我的表单数据。

有人知道如何实现吗？

FIDDLE

$('#example .fileinput-upload-button').on('click', function(event) {

  var td = $(this).closest("td");
  var parentTD = td.parent();

  var form = $(this).closest("form");
var url = "example/upload.php?type=photo"
  var data = new FormData(form);
  alert(form);

  $.ajax({
    type: "POST",
    url: url,
    data: data,
    mimeType: "multipart/form-data",
    contentType: false,
    cache: false,
    dataType: "html",
    processData: false,
    success: function(data) {

      alert(data);
    }
  });

PHP

$type = filter_input(INPUT_GET, "type");


$target_dir_header = $includesDir . "dashboard/resources/header_pic/";
$dataHeader = $_FILES['input7'];
$dataHeader_ext = explode('/', $dataHeader['type']);
$imageFileType_header = $dataHeader_ext[1];
$target_file_header = $target_dir_header . basename("header" . $imageFileType_header);


echo $type . " - " . $imageFileType_header;

【问题讨论】：

jsFiddle中没有form标签。
是的，在输入之前有..
你是对的，对不起。见this answer。请改用var data = new FormData(); data.append('file', $('input[type=file]', form)[0].files[0]);。
谢谢，我已经尝试过了，但我仍然无法获取文件。如果我var_dump($path_) 我得到` ["basename"]=> string(0) "" ["filename"]=> string(0) ""`

标签： javascript php jquery ajax datatables

【解决方案1】：

将您的 JQuery 代码更改为：

var td = $(this).closest("td");
var parentTD = td.parent();

var url = "example/upload.php?type=photo"
var form = $(this).closest("form").get(0);

   $.ajax({
   type: "POST",
   url: url,
   data: new FormData(form),
   mimeType: "multipart/form-data",
   contentType: false,
   cache: false,
   dataType: "html",
   processData: false,
   success: function(data) {
     alert(data);
   }

});

你的问题解释了here

【讨论】：

谢谢你..这是可行的，但是 php 只接收来自第一行的数据。如果我在其他行上选择图片，则接收到的数据始终来自表中的第一行
@SNos，使用$(this).closest("form").get(0) 而不是$('form').get(0)。