Question

I have a form that contains intensive work. I want to blockUI the form from the time its rendering (initialize) to the time its done, and everything inside of it is rendered. Any idea how can I do that??. I tried different things with blockUI(p and pe) but I couldn't find a way to trigger blockUI when a form finishes its intensive work. Thanks for your help in advance.

Note: this process will happen without requiring a submit of the form. Am using the latest of Primefaces snapshot

 <ui:define name="content">
    <form id="stuff">
        <!--a lot of stuff here-->
    </form>
 </ui:define>
Was it helpful?

Solution

This blocks the UI during form rendering.

<ui:define name="content">

    <p:blockUI block="stuff" widgetVar="blockUIWidget">
        <h:outputText value="Please wait..."/>
    </p:blockUI>

    <script type="text/javascript">
        $(document).ready(function() {
            blockUIWidget.show();
        });

        $(window).load(function() {
            blockUIWidget.hide();
        });
    </script>
    <form id="stuff">
        <!--a lot of stuff here-->
    </form>
</ui:define>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top