The <apex:actionSupport> component is another important component that's used for adding AJAX support to another component. It allows the component to be refreshed asynchronously by the server when a particular event occurs.
Just like other components, the <apex:actionSupport> component also has the following attributes:
1. action
The action attribute is of type "ApexPages.Action" that is used for defining the action method invoked by the AJAX request to the server. The page simply refreshes when the user does not specify the action.
Syntax
<apex:actionSupport action="{!incrementCounter}"></apex:actionSupport>
2. disabled
The disabled attribute is of type Boolean, which specifies whether the component is disabled or not. The defined action is not invoked when its value is set to true.
Syntax
<apex:actionSupport action="{!incrementCounter}" disabled="false"></apex:actionSupport>
3. disableDefault
The disableDefault attribute is of type Boolean, which specifies whether the default browser processing should be skipped for the associated event or not. By default, its value is set to true.
Syntax
<apex:actionSupport action="{!incrementCounter}" disableDefault="false"></apex:actionSupport>
4. event
The event attribute is of type String used to define the DOM event used for generating AJAX requests. Onclick, ondbclick, onkeyup, etc., are the possible values for this attribute.
Syntax
<apex:actionSupport action="{!incrementCounter}" event="onclick"></apex:actionSupport>
5. focus
The event attribute is of type String that is used for defining the id of that component which is in focus after completion of the AJAX request.
Syntax
<apex:actionSupport action="{!incrementCounter}" id="cmpId"></apex:actionSupport>
6. id
The event attribute is of type String that is used for defining an identifier. It allows the component to be referenced by another component on the page.
Syntax
<apex:actionSupport action="{!incrementCounter}" id="cmpId"></apex:actionSupport>
7. immediate
The immediate attribute is of type Boolean. If its value is true, the action associated with the component will happen immediately. The validation rules associated with the fields on the page will not be processed by the function.
Syntax
<apex:actionSupport action="{!incrementCounter}" immediate= "true"></ apex:actionSupport>
8. oncomplete
String type attribute that defines the JavaScript method invoked when the result of an AJAX update request completes on the client.
AD
Syntax
<apex:actionSupport action="{!incrementCounter}" oncomplete= "{!save}"></ apex:acrtionSupport>
9. onbeforedomupdate
Another string type attribute that defines the JavaScript method that is invoked when the onbeforedomupdate event occurs.
Syntax
<apex:actionSupport action="{!incrementCounter}" onbeforedomupdate= "{!save}"></ apex:actionSupport>
10. onsubmit
The onsubmit attribute is of type string that is used for specifying the JavaScript method before sending an AJAX update request to the server.
Syntax
AD
<apex:actionSupport action="{!incrementCounter}" onsubmit= "{!save}"></ apex:actionSupport>
11. timeout
The timeout attribute is of type Integer that defines the amount of time before an AJAX update request should time out.
Syntax
<apex:actionSupport timeout= " 200"></ apex:actionSupport>
12. status
The status attribute is of type string that defines the Id of an associated component that displays the status of an AJAX update request.
Syntax
<apex:actionSupport status= " statusId"></ apex:acrtionSupport>
13. reRender
The reRender attribute is of type Object that is basically Id of one or more components which we need to redraw when the client receives the result of the action method.
Its value can be a single Id, comma-separated Id, or collection of Ids.
Syntax
<apex:actionSupport reRender= " div1" action= "{!save}"></ apex:acrtionSupport>
14. rendered
A Boolean attribute is used to specify whether the component is rendered on the page or not. By default, its value is set to true.
Syntax
<apex:actionSupport rendered= " div1" action= "{!save}"></ apex:actionSupport>
Let's take an example to understand how we can use the <apex:actionSupport> component in VF:
ApexActionSupportExample.vfp
<!-- Action Support Page with custom controller and tabStyle-->
<apex:page controller="ApexActionSupportController" 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:outputpanel id="panel1">
<apex:outputText value="Save"/>
<apex:actionSupport event="onclick" action="{!save}" reRender="pbId" status="statusId"/>
</apex:outputpanel>
<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>
ApexActionSupportController.apxc
// create ApexActionSupportController
public class ApexActionSupportController {
// declare a variable con of type Contact
public Contact con{get;set;}
// default constructor
public ApexActionSupportController(){
// initialize con
con = new Contact();
}
// create save() method to insert contact
public PageReference save(){
//insert con;
return null;
}
}
