<apex: actionStatus> Component in Visualforce Page

The <apex:actionStatus> component is one of the most important components that is used for displaying the status of the update request of an AJAX that can either be in progress or complete.

The actionStatus component has the following attributes:

1. dir

It is an important attribute of <apex:ationStatus> used for defining the direction in which the generated HTML component should be read. RTL(Right To Left) and LTR(Left To Right)are the two possible values for this attribute.

Syntax

2. for

It is of type string that is used for defining the Id of the <apex:actionRegion> component for which the status indicator displays status.

Syntax

3. id

It is of type string that is used for defining the identifier that allows this component to be referenced by other components on the page.

Syntax

4. lang

It is of type string that is used for defining the base language used for generated HTML output.

Syntax

5. layout

It is of type string that is used for defining the manner with which the <apex:actionStatus> component should be displayed on the page. Block and Inline are the two possible values for this attribute. By default, its value is set to inline.

Syntax

6. onclick

It is of type string that is used for defining the JavaScript method that is invoked when the onclick event occurs.

Syntax

7. ondbclick

It is of type string that is used for defining the JavaScript method that is invoked when the ondbclick event occurs.

Syntax

8. onkeydown

It is of type string that is used for defining the JavaScript method that is invoked when the onkeydown event occurs.

Syntax

9. onkeypress

It is of type string that is used for defining the JavaScript method that is invoked when the onkeypress event occurs.

Syntax

10. onkeyup

It is of type string that is used for defining the JavaScript method that is invoked when the onkeyup event occurs.

Syntax

11. onmousedown

It is of type string that is used for defining the JavaScript method that is invoked when the onmousedown event occurs.

Syntax

12. onmousemove

It is of type string that is used for defining the JavaScript method that is invoked when the onmousemove event occurs.

Syntax

13. onmouseout

It is of type string that is used for defining the JavaScript method that is invoked when the onmouseout event occurs.

Syntax

14. onmouseover

It is of type string that is used for defining the JavaScript method that is invoked when the onmouseover event occurs.

Syntax

15. onmouseup

It is of type string that is used for defining the JavaScript method that is invoked when the onmouseup event occurs.

Syntax

16. onstart

It is of type string that is used for defining the JavaScript method that is invoked at the start of the AJAX request.

Syntax

17. onstop

It is of type string that is used for defining the JavaScript method that is invoked after completion of the AJAX request.

Syntax

18. rendered

It is of type Boolean that is used for specifying whether the component is rendered on the page or not.

Syntax

19. startStyle

It is of type string that is used for defining the style that is used to display the status element at the start of an AJAX request.

Syntax

20. startStyleClass

It is of type string that is used for defining the style class that is used to display the status element at the start of an AJAX request.

Syntax

21. startText

It is of type string that is used for defining the status text that will be displayed at the start of an AJAX request.

Syntax

22. stopStyle

It is of type string that is used for defining the style that is used to display the status element after completion of an AJAX request.

Syntax

23. stopStyleClass

It is of type string that is used for defining the style class that is used to display the status element after completion of an AJAX request.

Syntax

24. stopText

It is of type string that is used for defining the status text that will be displayed after completion of an AJAX request.

Syntax

25. style

It is of type string that is used for defining the inline CSS that will be applied to the status element.

Syntax

26. styleClass

It is of type string that is used for defining the style class that will be applied to the status element.

Syntax

27. title

It is of type string that is used for defining the text that will be displayed as a tooltip when the user's mouse pointer hovers over this component.

Syntax

Let's take an example to understand how we can use action status in VF:

ApexActionStatusExample.vfp

<!-- Action Status Page with custom controller and tabStyle -->
<apex:page controller="ApexActionStatusController" tabStyle="Contact">
    <apex:form id="apexForm">
        <!-- use pageBlock, pageBlockButtonsn  and pageBlockSection to design apex form-->
        <apex:pageBlock id="pbId" title="New Contact Information">
            <!-- use pageBlockButtons for save and cancel -->
            <apex:pageBlockButtons>
                <apex:commandButton action="{!save}" value="Save" reRender="pbId" status="statusId"/>
                <apex:actionStatus id="statusId" >
                    <!-- use apex facet for for showing loading image-->
                    <apex:facet name="start" >
                        Saving...                    
                    </apex:facet>
                </apex:actionStatus>
            </apex:pageBlockButtons>
            <!-- pageBlockSection for displaying fields of Contact-->
            <apex:pageBlockSection id="pbSec1" title="Contact Information" collapsible="false">
                <apex:inputField value="{!con.FirstName}"/>
                <apex:inputField value="{!con.LastName}"/>
                <apex:inputField value="{!con.AccountId}"/>
                <apex:inputField value="{!con.Phone}"/>
                <apex:inputField value="{!con.Email}"/>
                <apex:inputField value="{!con.LeadSource}"/>
                <apex:inputField value="{!con.MailingStreet}"/>
                <apex:inputField value="{!con.MailingCity}"/>
                <apex:inputField value="{!con.MailingState}"/>
                <apex:inputField value="{!con.MailingPostalCode}"/>
                <apex:inputField value="{!con.MailingCountry}"/>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

ApexActionStatusController.apxc

// create ApexActionStatusController
public class ApexActionStatusController {
    // declare a variable con of type Contact
    public Contact con{get;set;}
    
    // default constructor
    public ApexActionStatusController(){
        // initialize con
        con = new Contact();
    }
    // create save() method to insert contact
    public PageReference save(){
        //insert con;
        return null;
    }
}

Output