Progress Indicator bar on Button -

Guys Some time We are facing issues to run Progress Indicator.

when we are doing any action our response in displaying at the same time so we need to use Progress bar to show information to the user.

Today I'll explain how to user progress Indicator on Button.

Step1- I have a Page where I am running some program on basis of Procedure call.

Step2- Once you'll click on runProgram one procedure will call and Progress indicator will show.

Step3- once procedure will run successfully it'll give a success message.

So the code which we have to add is given below -

you need to create a page and on button you need to call a clientListener.

<af:clientListener type="action" method="longRunningTask"/>

After that we need to add Dialog Popup and JavaScript code like below -

<af:popup childCreation="deferred" autoCancel="disabled" id="longRunningPopup"                          contentDelivery="immediate">
                <af:dialog id="dialog1" closeIconVisible="false" type="none" title="Loading Please Wait..."
                           inlineStyle="width:200px; text-align:center;">
                    
                </af:dialog>
            </af:popup>

            <af:resource type="javascript">
            
                            function longRunningTask(evt) {
                            var popup = AdfPage.PAGE.findComponentByAbsoluteId('longRunningPopup');
                            if (popup != null) {
                                AdfPage.PAGE.addBusyStateListener(popup, busyStateListener);
                                evt.preventUserInput();
                            }
                        }

                    function busyStateListener(evt) {
                        var popup = AdfPage.PAGE.findComponentByAbsoluteId('longRunningPopup');
                        if (popup != null) {
                            if (evt.isBusy()) {
                                popup.show();
                            }
                            else if (popup.isPopupVisible()) {
                                popup.hide();
                                AdfPage.PAGE.removeBusyStateListener(popup, busyStateListener);
                            }
                        }
                    }

            </af:resource>

That's it.
After adding this code you can able to see the progress Indicator on particular page.

Thanks Guys :)