Javascript 表单未提交文件/未定义索引：FileInput-PHP/AJAX/jQuery

我试图使用jQuery触发表单提交，然后使用AJAX调用一个PHP脚本，该脚本将处理文件并返回响应。然而，问题是提交表单时文件没有被上传

HTML:

PHP被称为：

public function actionParseExcel() {
    print "made it to parse".PHP_EOL;
    print "File:";

    if($_FILES['FileInput']['tmp_name']) {
        print_r($_FILES['FileInput']['tmp_name']);
    }

    else {
        print "Not found";
    }

    print "Done.";

}

---

我知道问题是我的表单没有提交所选的文件，因为这就是抛出“Undefined index”错误的典型原因。但是我不明白为什么。

要发送包含文件的表单，您需要使用enctype=“multipart/form data”。 但是，据我所知，不能使用ajax发送文件

因此，解决方案是使用隐藏的iFrame：

创建一个隐藏的iFrame（在表单外部）并将其分配为ID

创建指向您的PHP文件的表单，并使用属性enctype=“multipart/form data”和target=“ID\u OF\u IFRAME”（因此表单在提交时将发送到该IFRAME）

当PHP处理完文件后，您可以输出一个调用parent.YOURFUNCTION（）的javascript，这样您就可以在处理完成后做任何想做的事情

---

祝你好运

首先，如果您不想刷新页面，最好使用

或者通过函数uploadFile（）末尾的

调用JavaScript并

返回false

其次，您需要将

enctype=“multipart/form data”

放在

中

我知道您正在使用JQuery，您也应该使用它来发送AJAX请求：

// This code supports multiple type="file" inputs
// Variable to store your files
var files;

// Add events
$('input[type=file]').on('change', prepareUpload);

// Grab the files and set them to our variable
function prepareUpload(event)
{
  files = event.target.files;
}
// Create a formdata object and add the file
var data = new FormData();

// In case you want to upload more than one file
$.each(files, function(key, value)
{
    data.append(key, value);
});

$.ajax({
    url: 'your.php?FileInput',
    type: 'POST',
    data: data,
    cache: false,
    dataType: 'json',
    processData: false, // Prevent the file from beeing converted to string
    contentType: false, // Set the content file to false prevent JQuery from using 'application/x-www-form-urlencoded; charset=UTF-8' as default type
    ...
});

我希望这将引导您找到解决方案

---

编辑：

var文件

声明+

文件

处理

显示浏览文件功能似乎有点脱节。您仍然在使用内联JavaScript，这让我对流程感到困惑。其他人可能会觉得没问题。AJAX的

数据类型

是错误的，您可以在那里放置的内容有严格的限制（xml、json、脚本或html）。单独使用AJAX执行文件上传通常是不可能的，但是如果您使用HTML5，则有一些方法可以解决这个问题。@Akhilessingh-browseFile函数所做的唯一事情就是调用文件输入标记（我将其隐藏，因为它很难看）@JayBlanchard-上传不是在AJAX中进行的，而是在调用SubmitInput标记的

submitForm

函数中进行的。但是，您能进一步解释一下为什么内联javascript令人困惑吗？它所做的只是在.js文件中调用一个函数。我已经更新了我的AJAX函数。我来试一试。非常感谢。我想这样可以防止整个窗口刷新？通常，当我从一个表单标签调用一个php文件时，它会刷新整个页面，以显示php文件的返回，这就是我的想法。。。“模拟ajax”，即不刷新页面；）虽然我最终没有使用此解决方案，但这是一个很好的建议，因此我将其标记为答案您在哪里定义

文件

？当我在

中调用

uploadFile（）

时，我想我可以将该文件作为参数插入。。。。像这样：

很抱歉，我忘记了代码的上面几行（我会编辑它）。您的表单声明应该类似于

。简单地说，只需将您的

按钮替换为

（您无需为提交

而烦恼）
public function actionParseExcel() {
    print "made it to parse".PHP_EOL;
    print "File:";

    if($_FILES['FileInput']['tmp_name']) {
        print_r($_FILES['FileInput']['tmp_name']);
    }

    else {
        print "Not found";
    }

    print "Done.";

}

// This code supports multiple type="file" inputs
// Variable to store your files
var files;

// Add events
$('input[type=file]').on('change', prepareUpload);

// Grab the files and set them to our variable
function prepareUpload(event)
{
  files = event.target.files;
}
// Create a formdata object and add the file
var data = new FormData();

// In case you want to upload more than one file
$.each(files, function(key, value)
{
    data.append(key, value);
});

$.ajax({
    url: 'your.php?FileInput',
    type: 'POST',
    data: data,
    cache: false,
    dataType: 'json',
    processData: false, // Prevent the file from beeing converted to string
    contentType: false, // Set the content file to false prevent JQuery from using 'application/x-www-form-urlencoded; charset=UTF-8' as default type
    ...
});