我的条件:Java 7 / JSF 2.2 / PrimeFaces 6.1
我有一个编辑页面,该页面应允许加载并保存图像。为了使外观漂亮,应该在用户单击保存之前显示刚刚加载的图像。
我的页面的一部分是:
<h:form enctype="multipart/form-data" id="form">
<h2 class="page-header">Image load</h2>
<p:graphicImage id="image" required="true" value="#{bannerEditMB.image}" width="240" height="160"/>
<p:fileUpload id="imageLoad" fileUploadListener="#{bannerEditMB.imageLoad}"
auto="true" mode="advanced" update="image"
label="#{messages['banner.image.label']}"
allowTypes="/(\.|\/)(jpe?g)$/"
invalidFileMessage="Only .jpeg e .jpg" icon="fa fa-file-image-o"/>
<p:commandButton action="#{bannerEditMB.insert}" ajax="false" icon="fa fa-check" id="buttonAdd" rendered="#{not bannerEditMB.updateMode}"/>
<p:commandButton action="#{bannerEditMB.update}" ajax="false" icon="fa fa-check" id="buttonUpdate" rendered="#{bannerEditMB.updateMode}"/>
<p:commandButton action="#{bannerEditMB.cancel}" ajax="false" icon="fa fa-close" id="buttonCancel" immediate="true"/>
</h:form>
(视图作用域)后备bean是:
@ViewController
public class BannerEditMB extends AbstractEditPageBean<Banner, Long> {
private static final long serialVersionUID = 1L;
@Inject
private BannerBC bc;
private StreamedContent image = new DefaultStreamedContent();
@Override
public Banner handleLoad(Long id) {
Banner bean = bc.load(id);
imagem = new ByteArrayContent(bean.getImagem());
return bean;
}
public void imageLoad(FileUploadEvent event)
throws IOException {
byte[] content = event.getFile().getContents();
getBean().setImage(content);
image = new ByteArrayContent(content);
}
public StreamedContent getImage() {
return image;
}
}
问题是,当我单击加载按钮时,一切正常,包括imageLoad()
方法,该方法可以将内容正确设置为正在编辑的对象。实际上,如果单击“保存”按钮,则会按预期更新相应的数据库行,而刚加载的图像将保存在DB中。
调试显示,getImage()
方法在图像加载后被调用了两次,但是屏幕上没有任何变化,用户看不到刚刚加载的图像。
我的代码受《 PrimeFaces 6.1用户指南》的启发,该指南提供了类似的代码。