Primefaces: dynamic content refresh issue

Question

I have a webapp where I select some content to be deleted. A modal pops-up displaying a preview of the image/flash selected. I hit a button and everything works fine. But, when I select another content to be deleted, the modal pops-up and, for a microsecond, it displays the previously deleted file which is then replaced by the new content I want to delete.

The code for showing the dynamic content is as follows:

For images:

<p:graphicImage value="#{controller.tempImage}" height="110" 
    id="imageID" />

For flash:

<p:media value="#{controller.tempImage}" width="110" height="110" 
    id="imageID" player="flash" />

Controller:

public StreamedContent getTempImage() {
    try {
        FacesContext context = FacesContext.getCurrentInstance();

        if (context.getRenderResponse() ) {
            return new DefaultStreamedContent();
        }
        else {              
                tempImage = new DefaultStreamedContent(new FileInputStream("pathToFile"), "image/jpeg");                
        }
    } catch (FileNotFoundException e) {
        tempImage = new DefaultStreamedContent();
    }

    return tempImage;
}

I tried setting tempImage to null before loading and autoUpdate=true in the modal but no luck.

Delete button (the one that shows the delete modal):

<p:commandButton id="btnDelete" value="Delete" onclick="deleteModal.show();"  actionListener="#{controller.initDelete}" update=":deleteForm">

Delete form (xhtml):

<h:form  id="deleteForm" enctype="multipart/form-data" >
<p:dialog id="deleteDialog" widgetVar="deleteModal" modal="true" resizable="false" draggable="false" autoUpdate="true">
        <p:outputPanel autoUpdate="false" >
            <p:panelGrid id="panelId">
                <p:row>                 
                    <p:column>
                        <p:panelGrid id="bannerPanel">

                            <p:row>
                                <p:column>
                                 <p:graphicImage value="#{controller.tempImage}" height="110" id="imageID" />
                                </p:column>
                            </p:row>    

                        </p:panelGrid>
                    </p:column>
                </p:row>

                <f:facet name="footer">
                    <p:row>
                        <p:column>  
                                <p:commandButton id="doDeleteBtn" value="Delete"
                                     actionListener="#{controller.delete}" >                                                        
                                </p:commandButton>
                        </p:column>
                    </p:row>
                </f:facet>
            </p:panelGrid>
        </p:outputPanel>
</p:dialog>

It would be helpful to see more code... maybe the button that shows the dialog and the dialog itself (xhtml) and the method that deletes the content (bean) — Andre, Jan 28 '13 at 20:42

partlov · Accepted Answer · 2013-01-28T21:22:32.283

4

Change from:

onclick="deleteModal.show();"

to:

oncomplete="deleteModal.show();"

This will ensure that your dialog is viewed after AJAX request is completed, not before it is started.

You should use onclick, when you are creating so called push buttons, the buttons with type="button", which are just executing some JavaScript. Default type of buttons in Primefaces is submit.

edited Jan 28 '13 at 21:22

answered Jan 28 '13 at 20:47

partlov

13,789
6
63
82

Yep. That's it. Thanks a lot for your help, again :P. You've been very much helpful. – CountD Jan 28 '13 at 20:59
By the way (I dunno if I can ask here)... I constantly get the warning `JSF1091 No mime type could be found for file dynamiccontent` and I've followed a few tutorials posted here and in some PF forums but no change. Do you have any idea about this issue? It appears to be quite common but I can't get rid of it. – CountD Jan 28 '13 at 21:11
@partlov, you're quick! ;) – Andre Jan 28 '13 at 21:15

Primefaces: dynamic content refresh issue

1 Answers1