The <apex: pageBlock> component is the most used component on the Visualforce page that specifies the page area having a similar appearance to the Salesforce detail page. This component supports the HTML pass-through attributes by using the "html-" prefix. The attributes are attached to the generated container <div> tag.
The <apex: pageBlock> component has the following attributes on the Visualforce page:
1. dir
The dir is a string-type attribute used to specify the direction in which the generated HTML component should be read. LTR and RTL are the two possible values for this attribute.
Syntax:
<apex: pageBlock dir="RTL"></apex: pageBlock>
2. helpTitle
The helpTitle is a string-type attribute used for specifying the text that needs to be displayed when the user hovers the mouse over the help link for the page block. If we specify this attribute, we should have to provide a value for helpTitle The helpTitle attribute is ignored if we specify the header facet value in the pageBlock.
Syntax:
<apex: pageBlock helpTitle="Help Title"></apex: pageBlock>
3. helpUrl
The helpUrl is a string-type attribute used for specifying the webpage URL that provides help for the pageBlock. If we specified this attribute, we should have to provide a value for helpURL. The helpTitle attribute is ignored if we specify the header facet value in the pageBlock.
Syntax:
<apex: pageBlock helpUrl="Help URL"></apex: pageBlock>
4. id
The id is a string-type attribute, i.e., a unique identifier that allows this component to be referenced by other components on the page.
Syntax:
<apex: pageBlock id="blockId"></apex: pageBlock>
5. lang
The lang is a string-type attribute that specifies the base language used for the generated HTML output. The values can be "en" or "en-US" etc.
Syntax:
AD
<apex: pageBlock language="en"></apex: pageBlock>
6. mode
The mode is a string-type attribute used to specify the mode for the page block area. These are the possible value for this attribute:
detail
maindetail
edit
inlineEdit
Syntax:
<apex: pageBlock mode="detail"></apex: pageBlock>
7. onclick
The onclick is another string-type attribute used to specify the JavaScript method that needs to be invoked when the onclick event occurs or when the user clicks the page block.
AD
Syntax:
<apex: pageBlock onclick="saveRecords();"></apex: pageBlock>
8. ondblclick
The ondblclick is a string-type attribute used to specify the JavaScript method that needs to be invoked when the ondblclick event occurs or when the page block is clicked twice.
Syntax:
<apex: pageBlock ondblclick="saveRecords();"></apex: pageBlock>
9. onkeydown
The onkeydown is a string-type attribute used for specifying the JavaScript method that needs to be invoked when the onkeydown event occurs or when the user presses a keyboard key.
Syntax:
<apex: pageBlock onkeydown="saveRecords();"></apex: pageBlock>
10. onkeypress
The onkeypress is a string-type attribute used for specifying the JavaScript method that needs to be invoked when the onkeypress event occurs or when the user holds down or presses a keyboard key.
Syntax:
<apex: pageBlock onkeypress="saveRecords();"></apex: pageBlock>
11. onkeyup
The onkeyup is a string-type attribute used for specifying the JavaScript method that needs to be invoked when the onkeyup event occurs or when the user releases a keyboard key.
Syntax:
<apex: pageBlock onkeyup="saveRecords();"></apex: pageBlock>
12. onmousedown
The onmousedown attribute is a string-type attribute used to invoke the JavaScript method when the onmousedown event occurs or when the user presses the mouse button.
Syntax:
<apex: pageBlock onmousedown="countKeys();"></apex: pageBlock>
13. onmousemove
The onmousemove is a string-type attribute used for specifying the JavaScript method that needs to be invoked when the onmousemove event occurs or when the user moves the mouse pointer.
Syntax:
<apex: pageBlock onmousemove="countKeys();"></apex: pageBlock>
14. onmouseout
The onmouseout is a string-type attribute used for specifying the JavaScript method that needs to be invoked when the onmouseout event occurs or when the user moves the mouse pointer away from the page block.
Syntax:
<apex: pageBlock onmouseout="countKeys();"></apex: pageBlock>
15. onmouseover
The onmouseover attribute 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 page block.
Syntax:
<apex: pageBlock onmouseover="countKeys();"></apex: pageBlock>
16. onmouseup
The onmouseup is a string-type attribute used for specifying the JavaScript method that needs to be invoked when the onmouseup event occurs or when the user releases the mouse button.
Syntax:
<apex: pageBlock onmouseup="countKeys();"></apex: pageBlock>
17. rendered
The rendered is a Boolean-type attribute used to specify whether this component is rendered on the page. Boolean-value true is set as a default value for this attribute.
Syntax:
<apex: pageBlock rendered="true"></apex: pageBlock>
18. tabStyle
The tabStyle is a string-type attribute used to specify the Salesforce object or custom Visualforce tab that controls the color scheme of the page block.
Syntax:
<apex: pageBlock tabStyle="Account"></apex: pageBlock>
19. title
The title is a string-type attribute used to specify the text that needs to be displayed as the title of the page block.
Syntax:
<apex: pageBlock title="button title"></apex: pageBlock>
Let's take an example to understand how we can use the <apex: pageBlock> component inside the VF page:
<apex:page>
<apex:pageBlock title="Account Information">
<apex:pageBlockSection>
<apex:outputText value="Welcome to the Account Information page!"/>
</apex:pageBlockSection>
<apex:pageBlockSection title="Details">
<apex:outputText value="Account Name: Salesforce Inc"/>
<br/>
<apex:outputText value="Industry: Cloud Computing"/>
<br/>
<apex:outputText value="Annual Revenue: $20 Billion"/>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:page>
