FileUpload：选择文件未在预览中显示

Question

我在高级模式下使用 FileUpload。我之前在它工作的同一应用程序的另一个页面上使用过它。 但现在我试图在另一个页面上再次使用它，但我无法让它工作。 出现 3 个按钮（选择、上传和取消）。当我选择一个文件时，“上传”和“取消”按钮已启用，但所选文件未显示在按钮下方。

按下上传按钮时，我收到以下消息（我的处理程序从未被调用）：

未捕获的类型错误：无法读取未定义的属性“提交”

来源：fileupload.js.xhtml?ln=primefaces&v=5.2:1 我一直在寻找 javascript 中的调试器。错误发生在以下代码块中：

upload: function() {
    for (var a = 0; a < this.files.length; a++) {
        this.files[a].row.data("filedata").submit()
    }
},

我认为这个错误是因为在选择一个文件后，它被添加到名为 files 的数组中，但 data("filedata") 也应该存在并且文件不存在。所以脚本尝试调用未定义的提交方法。我猜未定义的东西是一个输入，应该在选择一个文件后添加到 html 中并且没有添加。

有没有人知道是什么导致了这个问题？

我不知道它是否相关，但是 FileUpload 工作的页面是用于上传图像的，并且在该页面上指定了 allowTypes，而在此页面上我正在上传文本文件并且未指定属性 allowTypes。所以我尝试选择一个图像文件（gif 或 png），但也没有显示，在这种情况下，上传和取消按钮保持禁用状态。 在指定arplytypes并选择坏文件时，错误消息显示在按钮下，但选择匹配文件时，它仍然是相同的。它不起作用。

我还在 Prime 社区论坛上发布了这个问题：http://forum.primefaces.org/viewtopic.php?f=16&t=46724&p=145363&sid=54403839b9ad4535b70087b19048cf04#p145363

Answer 1

我现在已经开始工作了。 FileUpload 嵌入在 2 个 panelGrids 中。删除两个 panelGrids 后，FileUpload 工作。 似乎 panelGrid 可以以 FileUpload 不再找到它自己的文件列表的方式弄乱 HTML 元素树结构（它使用 JQuery 来找到它）。

所以，我可以继续我的工作了。 但我仍然不知道到底发生了什么，我很想知道。