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
<apex:actionStatus dir="RTL"></apex:actionStatus>
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
<apex:actionStatus for="cmpId"></apex:actionStatus>
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
<apex:actionStatus id="statusId"></apex:actionStatus>
4. lang
It is of type string that is used for defining the base language used for generated HTML output.
Syntax
<apex:actionStatus lang="en"></apex:actionStatus>
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
<apex:actionStatus layout="block"></apex:actionStatus>
6. onclick
It is of type string that is used for defining the JavaScript method that is invoked when the onclick event occurs.
Syntax
<apex:actionStatus onclick="checkValidation();"></apex:actionStatus>
7. ondbclick
It is of type string that is used for defining the JavaScript method that is invoked when the ondbclick event occurs.
Syntax
<apex:actionStatus ondbclick="checkValidation();"></apex:actionStatus>
8. onkeydown
It is of type string that is used for defining the JavaScript method that is invoked when the onkeydown event occurs.
AD
Syntax
<apex:actionStatus onkeydown="checkValidation();"></apex:actionStatus>
9. onkeypress
It is of type string that is used for defining the JavaScript method that is invoked when the onkeypress event occurs.
Syntax
<apex:actionStatus onkeypress="checkValidation();"></apex:actionStatus>
10. onkeyup
It is of type string that is used for defining the JavaScript method that is invoked when the onkeyup event occurs.
Syntax
AD
<apex:actionStatus onkeyup="checkValidation();"></apex:actionStatus>
11. onmousedown
It is of type string that is used for defining the JavaScript method that is invoked when the onmousedown event occurs.
Syntax
<apex:actionStatus onmousedown="checkValidation();"></apex:actionStatus>
12. onmousemove
It is of type string that is used for defining the JavaScript method that is invoked when the onmousemove event occurs.
Syntax
<apex:actionStatus onmousemove="checkValidation();"></apex:actionStatus>
13. onmouseout
It is of type string that is used for defining the JavaScript method that is invoked when the onmouseout event occurs.
Syntax
<apex:actionStatus onmouseout="checkValidation();"></apex:actionStatus>
14. onmouseover
It is of type string that is used for defining the JavaScript method that is invoked when the onmouseover event occurs.
Syntax
<apex:actionStatus onmouseover="checkValidation();"></apex:actionStatus>
15. onmouseup
It is of type string that is used for defining the JavaScript method that is invoked when the onmouseup event occurs.
Syntax
<apex:actionStatus onmouseup="checkValidation();"></apex:actionStatus>
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
<apex:actionStatus onstart="checkValidation();"></apex:actionStatus>
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
<apex:actionStatus onstop="checkValidation();"></apex:actionStatus>
18. rendered
It is of type Boolean that is used for specifying whether the component is rendered on the page or not.
Syntax
<apex:actionStatus rendered="false"></apex:actionStatus>
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
<apex:actionStatus startStyle="color:blue;"></apex:actionStatus>
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
<apex:actionStatus startStyleClass="className"></apex:actionStatus>
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
<apex:actionStatus startText="Loading"></apex:actionStatus>
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
<apex:actionStatus stopStyle="color:blue;"></apex:actionStatus>
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
<apex:actionStatus stopStyleClass="className"></apex:actionStatus>
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
<apex:actionStatus stopText="Loading Finished"></apex:actionStatus>
25. style
It is of type string that is used for defining the inline CSS that will be applied to the status element.
Syntax
<apex:actionStatus style="color:blue;"></apex:actionStatus>
26. styleClass
It is of type string that is used for defining the style class that will be applied to the status element.
Syntax
<apex:actionStatus styleClass="className"></apex:actionStatus>
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
<apex:actionStatus title="Action Status Title"></apex:actionStatus>
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;
}
}