Can I execute javascript after file response from non-ajax primefaces action?

Question

I have a form in my primefaces app which calls an action from a backing bean and the action responds with a file for the user to download using an outputStream.

On the client side, I have a fake submit commandbutton with an onclick event handler that fires javascript that displays a spinner, then clicks a hidden "actual" submit commandbutton which calls the backing bean action that responds with the file.

Once I get a response, I'd like to hide the spinner.

I know I have to use ajax=false if I want the server to respond with a file. But then I can't use an oncomplete listener.

Is there any solution/workaround here to fire off some javascript once I get the response on the client side? I found a couple old forum posts online but none contain a workable.

// The buttons and spinner
<i class="fa fa-spin fa-spinner" id="spinner" style="display:none;"/>
<p:commandButton widgetVar="fakeSubmitButton" type="button" value="Submit" onclick="submit9);" ajax="false" /> 
<p:commandButton widgetVar="actualSubmitButton" type="submit" action="#{testController.respondWithFile}" value="" style="display:none;" ajax="false"/> 

// ... and the two javascript functions 
function submitReport() {
    $('#spinner').show();
    PF('actualSubmitButton').getJQ().click();
}           
function postSubmitReport() {
    $('#spinner').hide();
}

// ... and on the server side I respond with a file by grabbing the ExternalContext from the FacesContext and using its outputStream.

user1538516 user1538516 · Accepted Answer · 2019-02-18T02:03:34

If there are better alternatives, I'd still like to hear them, however I figured out a way to achieve the behavior I want by using a p:fileDownload similar to the showcase example: https://www.primefaces.org/showcase/ui/file/download.xhtml . On the server side my code is relatively unchanged, except instead of returning the response file using the ExternalContext's output stream, I'm building a StreamedContent which gets returned from the function called by the fileDownload widget.

Can I execute javascript after file response from non-ajax primefaces action?

1 Answers