Question

我有一个自定义组件（即，其中带有ui：composition的xhtml文件），其中有一个文件上传字段。选择文件后，将通过AJAX这样上传文件

<uc:fileUpload
  id="#{id}fileUploadComponent"
  idSuffix="#{id}fileUploadSuffix"
  value="#{fileUpload.docsFilePart}"
  accept="#{fieldWrapper.acceptedFileTypes}"
  widgetVar="#{id}documentUploadWidget"
  nullAllowed="#{!((fieldDef.mandatory and 
  fieldWrapper.getCurrentFileCount() lt 1) and isSaving)}"
  maxSize="#{customField.maxFileSize}" >                                     
  <f:ajax listener="#{fileUpload.uploadNewFile(fieldWrapper)}" render="#{localId}fileUploadMain messages"/>
</uc:fileUpload>

在此上传下方，有一个<div>，其ID与ajax调用的render属性中指定的ID相同，其中显示了用于下载文件的链接。发生的事情很奇怪-选择文件后，将其上载，<div>会使用指向新上载文件的链接正确更新。但是，当我单击页面上的“取消”或“保存”时，将调用其相应的操作，正确的响应将返回到浏览器（状态为200），但浏览器似乎忽略了它-页面未进行视觉更新或任何其他内容...

自定义组件是相当大的一段代码，具有不太容易重写的逻辑，因此在这一点上进行替换将很困难...

一件事可能不是上载文件发生在单独的控制器中，而主页控制器是另一种。这是因为应该使用单独的控制器来处理来自自定义组件的上传。

我无法真正理解到底发生了什么，甚至更甚于为什么，我将不胜感激！

对于它的价值，我在Wildfly 11（由AS提供的版本）上使用Mojarra

Answer 1

事实证明，原因是通过JSF AJAX上传文件导致创建了一个称为“ JSFFrameId”的iframe，并将该框架设置为嵌套表单的目标。 AJAX请求完成后，不会删除/清除目标，从而导致响应进入该iframe并中断视图。目前，我不确定是什么原因导致的，但是对我来说，一种解决方法是在onevent定义中包含<f:ajax>，清除表单目标，如下所示：

<f:ajax 
  listener="#{fileUpload.uploadNewFile(fieldWrapper)}"
  onevent="function(e){if (e.status == 'complete') { $(e.source).parents('form').attr('target','');}"
  render="#{localId}fileUploadMain messages">

我将检查其他状态可能需要处理，但是基本上可以解决此问题。如果有人对导致JSF离开此iframe而不重置表单目标的原因表示怀疑，这可能会很有用。

Ajax调用后页面未更新

1 个答案: