JSF 在文件输入后没有重定向请求 ajax
JSF no redirect request after file input ajax
我在 JSF 2.2 中有一个表单:
<h:form enctype="multipart/form-data">
<h:outputLabel>title *</h:outputLabel>
<h:inputText value="#{bean.title}" required="" />
<h:outputLabel>Image *</h:outputLabel>
<h:inputFile value="#{bean.picutreFile}" a:accept="image/*">
<f:ajax listener="#{bean.uploadPicture}" />
</h:inputFile>
<h:commandLink action="#{bean.save}">
Save
</h:commandLink>
</h:form>
函数:
public String save() {
return "/index?faces-redirect=true";
}
public void uploadPicture() {
// Do nothing
}
但是在我选择图片并调用uploadPicture
函数后,save
函数无法重定向页面。它调用 save
但重定向不起作用,只是刷新当前页面。
如果我跳过文件上传,它会正常重定向。我怎样才能让它工作?
编辑
我注意到如果我删除 ajax <f:ajax listener="#{bean.uploadPicture}" />
它会按预期工作。但我必须要 ajax 因为我想在上传后显示图像。
编辑 2
我可以看到在调用 ajax 之后,JSF 在页面底部创建了一个奇怪的 iframe,其正文中带有 partial-response
标记,当我按下“保存”时 iframe 被重定向到目的地。这是为什么??
据我所知,JSF 会阻止您的请求,直到 ajax 要求安全。也许您可以在 ajax 调用时放置一个处理栏或类似的东西。因此,在 ajax 调用完成之前,用户无法单击保存按钮。
点击上传按钮后点击保存按钮可以稍等一下吗?如果我是对的,它应该可以工作。
我转载了。我确实同意这种行为令人困惑且不直观,但我不会说这是 JSF 实现中的错误,因为您实际上是将 ajax 与常规请求混合在一起,这首先是错误的。另请参阅此相关问题 。
正确的方法是要么使命令link也成为ajaxlink,
<h:commandLink action="#{bean.save}">
Save
<f:ajax execute="@form" />
</h:commandLink>
或从<h:inputFile>
中删除<f:ajax>
(并在save()
中执行上传处理)。
<h:inputFile value="#{bean.picutreFile}" a:accept="image/*" />
顺便说一下,您看到的 iframe 是在文件上传期间模拟异步行为的古老技巧,早在 XHR2 / FormData API was standardized. This approach was during JSF 2.2 development preferred over XHR2 due to better backwards compatibility in webbrowsers (particularly MSIE). See also a.o. How to make Asynchronous(AJAX) File Upload using iframe?
之前就已经发明了
我在 JSF 2.2 中有一个表单:
<h:form enctype="multipart/form-data">
<h:outputLabel>title *</h:outputLabel>
<h:inputText value="#{bean.title}" required="" />
<h:outputLabel>Image *</h:outputLabel>
<h:inputFile value="#{bean.picutreFile}" a:accept="image/*">
<f:ajax listener="#{bean.uploadPicture}" />
</h:inputFile>
<h:commandLink action="#{bean.save}">
Save
</h:commandLink>
</h:form>
函数:
public String save() {
return "/index?faces-redirect=true";
}
public void uploadPicture() {
// Do nothing
}
但是在我选择图片并调用uploadPicture
函数后,save
函数无法重定向页面。它调用 save
但重定向不起作用,只是刷新当前页面。
如果我跳过文件上传,它会正常重定向。我怎样才能让它工作?
编辑
我注意到如果我删除 ajax <f:ajax listener="#{bean.uploadPicture}" />
它会按预期工作。但我必须要 ajax 因为我想在上传后显示图像。
编辑 2
我可以看到在调用 ajax 之后,JSF 在页面底部创建了一个奇怪的 iframe,其正文中带有 partial-response
标记,当我按下“保存”时 iframe 被重定向到目的地。这是为什么??
据我所知,JSF 会阻止您的请求,直到 ajax 要求安全。也许您可以在 ajax 调用时放置一个处理栏或类似的东西。因此,在 ajax 调用完成之前,用户无法单击保存按钮。
点击上传按钮后点击保存按钮可以稍等一下吗?如果我是对的,它应该可以工作。
我转载了。我确实同意这种行为令人困惑且不直观,但我不会说这是 JSF 实现中的错误,因为您实际上是将 ajax 与常规请求混合在一起,这首先是错误的。另请参阅此相关问题 。
正确的方法是要么使命令link也成为ajaxlink,
<h:commandLink action="#{bean.save}">
Save
<f:ajax execute="@form" />
</h:commandLink>
或从<h:inputFile>
中删除<f:ajax>
(并在save()
中执行上传处理)。
<h:inputFile value="#{bean.picutreFile}" a:accept="image/*" />
顺便说一下,您看到的 iframe 是在文件上传期间模拟异步行为的古老技巧,早在 XHR2 / FormData API was standardized. This approach was during JSF 2.2 development preferred over XHR2 due to better backwards compatibility in webbrowsers (particularly MSIE). See also a.o. How to make Asynchronous(AJAX) File Upload using iframe?
之前就已经发明了