RichFaces fileUpload没有reRendering

时间:2013-01-19 12:36:03

标签: jsf richfaces jsf-1.2

我正在尝试在上传文件(照片)后重新呈现几个组件但由于某种原因,在完成上传后,组件不会被重新呈现。有人可以帮忙吗? 我在Tomcat 6中运行应用程序的64位Windows 7计算机上使用Java 1.6 JSF 1.2 Richfaces 3.3.3 Seam 2.2GA;

<h:panelGrid columns="2" id="photoGrid"
    rendered="#{not signUpAction.fileUpRendered}"     styleClass="standard">
    <h:graphicImage value="#{signUpAction.imageUrl}" width="150" height="171" />
    <a4j:region>
        <a4j:commandLink id="remove" action="#{signUpAction.removePhoto}"
            reRender="a4jphotoUpload" value="Remove Photo" />
    </a4j:region>                               
</h:panelGrid>
<h:panelGroup id="photoGroup" rendered="#{signUpAction.fileUpRendered}">
    <rich:fileUpload maxFilesQuantity="1"
        fileUploadListener="#{signUpAction.listener}"
        addControlLabel="Add a photo..." allowFlash="true"
        id="photoUploadWidget" autoclear="true"
        listHeight="1" immediateUpload="true" acceptedTypes="jpg,jpeg,png,gif">
        <f:facet name="label">
            <h:outputText value="{_KB}KB from {KB}KB uploaded --- {mm}:{ss}" />
        </f:facet>
        <a4j:support event="onuploadcomplete" reRender="photoGrid,photoGroup"/>
    </rich:fileUpload>
</h:panelGroup>

我终于想出了一个解决方案,我调用a4j:jsFunction重新渲染组件并从onuploadcomplete事件中调用它(参见下面的代码)                            
                     
    

<h:panelGroup id="photoGroup" rendered="#{signUpAction.fileUpRendered}">
    <rich:fileUpload maxFilesQuantity="1" fileUploadListener="#{signUpAction.listener}"
    addControlLabel="Add a photo..."
    id="photoUploadWidget" autoclear="true" onuploadcomplete="reloadPhotoPanel()" onfileuploadcomplete="reloadPhotoPanel()"
    listHeight="1" immediateUpload="true" acceptedTypes="jpg,jpeg,png,gif">
    </rich:fileUpload>
</h:panelGroup>     
</a4j:outputPanel>  

<a4j:jsFunction id="reloadPhotoPanel" name="reloadPhotoPanel" reRender="photoPanel,photoGrid,photoGroup" />

1 个答案:

答案 0 :(得分:2)

问题在于您尝试重新渲染第一次加载页面时未呈现的组件,这将是photoGrid组件。

为了使其正常工作,您应该将非rendererd组件包装在UIContainer(如<a4j:outputPanel>)内,该组件将始终呈现并重新呈现更大的容器。

<!--
     now you will rerender the a4j:outputPanel 
     and the inner h:panelGrid will appear/dissapear
-->
<a4j:outputPanel id="photoGrid">
    <h:panelGrid columns="2"
        rendered="#{not signUpAction.fileUpRendered}"     styleClass="standard">
        <h:graphicImage value="#{signUpAction.imageUrl}" width="150" height="171" />
        <a4j:region>
            <a4j:commandLink id="remove" action="#{signUpAction.removePhoto}"
                reRender="a4jphotoUpload" value="Remove Photo" />
        </a4j:region>                               
    </h:panelGrid>
</a4j:outputPanel>
<!--
     following the same logic in the h:panelGroup that renders
     the rich:fileUpload component
-->
<a4j:outputPanel id="photoGroup">
    <h:panelGroup rendered="#{signUpAction.fileUpRendered}">
        <rich:fileUpload maxFilesQuantity="1"
            fileUploadListener="#{signUpAction.listener}"
            addControlLabel="Add a photo..." allowFlash="true"
            id="photoUploadWidget" autoclear="true"
            listHeight="1" immediateUpload="true" acceptedTypes="jpg,jpeg,png,gif">
            <f:facet name="label">
                <h:outputText value="{_KB}KB from {KB}KB uploaded --- {mm}:{ss}" />
            </f:facet>
            <a4j:support event="onuploadcomplete" reRender="photoGrid,photoGroup"/>
        </rich:fileUpload>
    </h:panelGroup>
</a4j:outputPanel>