<apex:form> Component in Visualforce Page

The <apex:form> component is one of the most important components on the Visualforce page. The <apex:form> component defines a section that allows the user to enter input and submit it using the <apex:commandButton> or <apex:commandLink> component. The data which needs to be displayed in the form is determined by the body of the <apex:form>. It also defines the way in which the data is processed. We can use multiple <apex:form>, but for the best practices, we have to use one <apex:form> in a page or custom component.

The <apex:form> component has the following attributes:

1. accept

The "accept" is a string type attribute, i.e., a list of content types in a comma-separated way. The list holds the content types which can handle by the server. These are some of the possible values for the accept attribute:

1. text/html
2. image/png
3. image/gif
4. video/mpeg
5. text/css
6. audio/basic

Syntax:

2. acceptcharset

The "acceptcharset" is a string type attribute, i.e., a list of character encoding types in a comma-separated way. The list holds the character encoding types which can handle by the server. UNKNOWN is the default value for this attribute.

Syntax:

3. enctype

The "enctype" is a string type attribute that defines the content type used for submission of the form to the server. The application/x-www-form-urlencoded is the default value for this attribute.

Syntax:

4. dir

The "dir" is a string-type attribute used to specify the direction in which the generated HTML component should be read. Possible values for this attribute include:

1. LTR
2. RTL

Syntax:

5. forceSSL

The forceSSL is a Boolean type attribute that specifies whether the form will be submitted using SSL or not, regardless of whether the page itself was served with SSL.

6. id

The id is a string type attribute, i.e., a unique identifier which is used for referencing this component by other components in the page.

Syntax:

7. lang

The lang is a string-type attribute that defines the base language for the generated HTML output. The "en" or "en-US" are the two possible values for this attribute.

Syntax:

8. onclick

The onclick is a string-type attribute used to invoke the JavaScript method when the onclick event occurs or simply when the user clicks the apex form.

Syntax:

9. ondblclick

The ondblclick is a string-type attribute used to invoke the JavaScript method when the ondblclick event occurs or simply when the form is clicked twice.

Syntax:

10. onkeydown

The onkeydown is a string type attribute used to invoke the JavaScript method when the onkeydown event occurs or simply when the user presses a keyboard key.

Syntax:

11. onkeypress

The onkeypress is a string type attribute used to invoke the JavaScript method when the onkeypress event occurs or simply when the user holds down or presses a keyboard key.

Syntax:

12. onkeyup

The onkeyup is a string-type attribute used to invoke the JavaScript method when the onkeyup event occurs or simply when the user releases a keyboard key.

Syntax:

13. onmousedown

The onmousedown is a string-type attribute used to invoke the JavaScript method when the onmousedown event occurs or simply when the user presses the mouse button.

Syntax:

14. onmousemove

The onmousemove is a string-type attribute used to invoke the JavaScript method when the onmousemove event occurs or simply when the user moves the mouse pointer.

Syntax:

15. onmouseout

The onmouseout is a string-type attribute used to invoke the JavaScript method when the onmouseout event occurs or when the user moves the mouse pointer away from the form.

Syntax:

16. onmouseover

The onmouseover is a string-type attribute used to invoke the JavaScript method when the onmouseover event occurs or when the user moves the pointer over the form.

Syntax:

<apex:form onmouseover="countKeys();"></apex:form>

17. onmouseup

The onmouseup is a string-type attribute used to invoke the JavaScript method when the onmouseup event occurs or when the user releases the mouse button.

Syntax:

<apex:form onmouseup="countKeys();"></apex:form>

18. onreset

The onreset is a string-type attribute used to invoke the JavaScript method when the onreset event occurs or when the user clicks the reset button on the form.

Syntax:

<apex:form onreset="countKeys();"></apex:form>

19. onsubmit

The onsubmit is a string-type attribute used to invoke the JavaScript method when the onsubmit event occurs or when the user clicks the submit button on the form.

Syntax:

<apex:form onsubmit="countKeys();"></apex:form>

20. prependId

The prependId is a Boolean type attribute used to specify whether this form should prepend its ID to the IDs of its child components or not during the clientid generation process.

Syntax:

<apex:form prependId="true"></apex:form>

21. rendered

The rendered is a Boolean-type attribute used to specify whether this component is rendered on the page or not. The Boolean value true is set as the default value for this attribute.

Syntax:

<apex:form rendered="true"></apex:form>

22. style

The style is a string type attribute used to specify the inline CSS that needs to be applied to it.

Syntax:

<apex:form style="background:red;"></apex:form>

23. styleClass

The styleClass is also a string type attribute used to specify the external CSS stylesheet that needs to be applied to display the form.

Syntax:

<apex:form styleClass="ClassName"></apex:form>

24. target

The target is a string-type attribute used for specifying the frame's name that displays the response after the form is submitted. These are some of the possible values for this attribute:

1. _blank
2. _parent
3. _self
4. _top

Except for these values, we can specify our own's target names by assigning the value to the name attribute of the desired destination.

Syntax:

<apex:form target="_blank"></apex:form>

25. title

The title attribute is of type string that is used to specify the text that will be displayed as a tooltip when the mouse hovers over this component

Syntax:

<apex:form title="button title"></apex:form>

Let's take an example to understand how we can use the <apex:form> component inside the VF page:

ApexFormExample.vfp

<!-- create apex page with custom controller--> <apex:page controller="ApexFormController"> <!-- use apex form to show the accounts and contacts table--> <apex:form id="changeStatusForm"> <apex:pageBlock title="Account/Contact Information"> <!-- command buttons are responsible for showing accounts in the table--> <apex:pageMessages /> <apex:pageBlockButtons> <apex:commandButton value="Show Accounts" action="{!getAccounts}"/> <apex:commandButton value="Show Contacts" action="{!getContacts}"/> </apex:pageBlockButtons> <apex:pageBlockSection rendered="{!IF(accounts.size>0, true, false)}"> <!-- create a table for showing accounts information --> <apex:pageBlockTable value="{!accounts}" var="acc"> <apex:column value="{!acc.Name}"/> <apex:column value="{!acc.AccountNumber}"/> <apex:column value="{!acc.Phone}"/> <apex:column value="{!acc.Rating}"/> <apex:column value="{!acc.Website}"/> </apex:pageBlockTable> </apex:pageBlockSection> <apex:pageBlockSection rendered="{!IF(contacts.size>0, true, false)}"> <!-- create a table for showing contacts information --> <apex:pageBlockTable value="{!contacts}" var="con"> <apex:column value="{!con.FirstName}" /> <apex:column value="{!con.LastName}"/> <apex:column value="{!con.AccountId}"/> <apex:column value="{!con.Email}"/> <apex:column value="{!con.Phone}"/> </apex:pageBlockTable> </apex:pageBlockSection> </apex:pageBlock> </apex:form> </apex:page>

ApexFormController.apxc

// create ApexFormController class to get the list of Accounts and Contacts public class ApexFormController { public List<account> accounts{get;set;} public List<contact> contacts{get;set;} // default constructor public ApexFormController (){ accounts = new List<account>(); contacts = new List<contact>(); } // create getAccounts() method to get account records public void getAccounts() { system.debug('Call Apex'); accounts = [select Id, Name, Rating, Phone, AccountNumber, Website From Account LIMIT 5]; } // create getContacts() method to get contact records public void getContacts() { contacts = [select Id, FirstName, LastName, AccountId, Email, Phone From Contact LIMIT 5]; } }

Output

---

Next Topicapex:gaugeSeries Component in Visualforce Page

← prev next →