Calling action from the popup

Question

I am facing when i am opening a popup.

<h:form>
<h:commandButton value="Submit" action="#{bean.submit}">
    <f:ajax render="popup" />
</h:commandButton>

<h:panelGroup id="popup">
    <ui:fragment rendered="#{not empty bean.url}">
        <script>window.open('#{bean.url}');</script>
    </ui:fragment>
</h:panelGroup>
</h:form>

i want to call an action when i close this popup

secondly i need to change width and height of this popup.

Answer 1

i want to call an action when i close this popup

Give a close button perform the desire action and redirect user to a page which is meant to closed on load by javascript

secondly i need to change width and height of this popup.

You can specify height & width in window.open()

Answer 2

i want to call an action when i close this popup

That's only possible if the enduser submits a <h:form> from inside the popup. You cannot hook a bean action when the enduser presses X button or Ctrl+W or Alt+F4. There's the window.onbeforeunload hook, but this does not allow you for reliably sending a HTTP request to the server side, which is necessary to invoke a bean action.

---

secondly i need to change width and height of this popup.

You can do that by supplying extra arguments to window.open . See also the documentation :

window.open('#{bean.url}', 'yourwindowname', 'width=600,height=480');

Answer 3

we are using onbeforeunload hook for calling the function from the popup when we popup window

<script>
        window.onbeforeunload = function() { 
            document.forms["showpdf"].elements["hiddenBtn"].click();
            }
    </script>
    <h:body>
        <f:view>
            <h:form id="showpdf">
                <iframe src="#{docProd.url}" width="100%" height="100%">     </iframe>
                <div align="center"><p:commandButton id="hiddenBtn"
                    onclick="#{docProd.resetUrl}" style="display:none"   /></div>
            </h:form>
        </f:view>
    </h:body>
    </ui:composition>