<apex: inputTextarea> Component in Visualforce Page

The <apex: inputTextarea> is another most used text area input element component. The <apex: inputTextarea> is another important component used for getting input from the user for the controller method that doesn't correspond to a field on the Salesforce object.

The HTML pass-through attributes are supported by this component using the "html-" prefix.

The <apex: inputTextarea> component has the following attributes on the Visualforce page:

1. accessKey

The "accessKey" is a string-type attribute used to specify the keyboard access key that puts the text area in focus. A user can enter a value in a text area when it is in focus.

Syntax:

2. cols

The "cols" is an integer-type attribute used to specify the width of the field. The number of characters is specified as the width of the field. These characters are displayed in a single row at a time.

Syntax:

3. dir

The "dir" is a string-type attribute used to specify the direction in which the generated HTML component should be used. The RTL and LTR are the two possible values for this attribute.

Syntax:

4. disabled

The "disabled" is a Boolean-type attribute used to specify whether this component should be displayed in a disabled state. The Boolean-value false is set as a default value for this component.

Syntax:

5. 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. The Boolean-value false is set as a default value for this attribute.

Syntax:

6. label

The "label" is a string-type attribute used to specify the text value that allows to display of a label next to the control and reference the control in the error message.

Syntax:

7. lang

The "lang" is a string-type attribute used to specify the base language for the generated HTML output. The en and en-US are the two possible values for this attribute.

Syntax:

8. onblur

The "onblur" is a string-type attribute used to specify the JavaScript method invoked when the onblur event occurs or the focus moves off of the text area.

Syntax:

9. onchange

The "onchange" is a string-type attribute used to specify the JavaScript method invoked when the onchange event occurs or the content of the text area change.

Syntax:

10. onclick

The "onclick" is a string-type attribute used to specify the JavaScript method invoked when the onclick event occurs or when the user clicks on the text area.

Syntax:

11. ondblclick

The "ondblclick" is a string-type attribute used to specify the JavaScript method invoked when the ondblclick event occurs or when the user clicks on the text area twice.

Syntax:

12. onfocus

The "onfocus" is a string-type attribute used to specify the JavaScript method invoked when the onfocus event occurs or when the focus is on the text area.

Syntax:

13. onkeydown

The "onkeydown" is a string-type attribute used to specify the JavaScript method invoked when the onkeydown event occurs or when the user presses a keyboard key.

Syntax:

14. onkeypress

The "onkeypress" is a string-type attribute used to specify the JavaScript method invoked when the onkeypress event occurs or the user presses or holds down a keyboard key.

Syntax:

15. onkeyup

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

Syntax:

16. onmousedown

The "onmousedown" is a string-type attribute used to specify the JavaScript method invoked when the onmousedown event occurs or when the user clicks a mouse button.

Syntax:

17. onmousemove

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

Syntax:

18. onmouseout

The "onmouseout" is a string-type attribute used to specify the JavaScript method invoked when the onmouseout event occurs or when the user moves the mouse pointer away from the text area.

Syntax:

19. onmouseover

The "onmouseover" is a string-type attribute used to specify the JavaScript method invoked when the onmouseover event occurs or when the user moves the mouse pointer over the component.

Syntax:

20. onmouseup

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

Syntax:

21. onselect

The "onselect" is a string-type attribute used to specify the JavaScript method invoked when the onselect event occurs or when the user selects text in the text area.

Syntax:

22. readonly

The "readonly" is a Boolean-type attribute used to specify whether this component should be rendered as read-only or not. The Boolean-value false is set as a default value for this attribute.

Syntax:

23. rendered

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

Syntax:

24. required

The "required" is a Boolean-type attribute used to specify whether this component is required or not. The Boolean-value false is set as a default value for this component. If we specify this attribute to true, the user has to enter this value.

Syntax:

25. richText

The "richText" is a Boolean-type attribute used to specify whether the text area should as rich text or plain text. The Boolean-value false is set as a default value for this attribute.

Syntax:

26. rows

The "rows" is an integer-type attribute used to specify the height of the text area as the number of rows that can display at a time.

Syntax:

27. style

The "style" is a string type attribute that is used for specifying the inline CSS style that will be applied for displaying the text area.

Syntax:

28. styleClass

The "styleClass" is a string type attribute that is used for specifying the style class that will be applied for displaying the text area.

Syntax:

29. tabindex

The "tabindex" is a string type attribute that is used for specifying the order in which this field is selected compared to other page components when a user presses the Tab key repeatedly. The value of this attribute should be between 0 to 32767.

Syntax:

30. title

The "title" is a string-type attribute that is used for specifying the text to display as a tooltip when the user's mouse pointer hovers over this component.

Syntax:

31. value

The "value" is an Object type attribute, i.e., an expression that references the controller class variable that is associated with this field.

Syntax:

Let's take an example to understand how we can use the <apex: inputTextarea> component on the Visualforce page.

ApexInputTextAreaExample.vfp

<!-- create an apex page with the custom controller to understand the use of apex input Textarea-->
<apex:page standardController="Contact" extensions="ApexInputTextAreaController" docType="html-5.0">
    <!-- use apex form to show the accounts and contacts table-->
    <apex:form id="formId">
        <apex:pageBlock title="Information Page">
            <!-- command buttons are responsible for showing accounts in the table-->
            <apex:pageMessages />
            <apex:pageBlockSection title="Account Information">
                <apex:inputField value="{!accRec.Name}" label="Account Name"/>
                <apex:inputField value="{!accRec.AccountNumber}" label="Account Number"/>
                <apex:inputField value="{!accRec.Active__c}" label="Active"/>
                <apex:inputField value="{!accRec.Phone}" label="Phone"/>
                <apex:inputField value="{!accRec.Rating}" label="Rating"/>
                <apex:inputField value="{!accRec.Website}" label="Website"/>
                <apex:inputTextarea value="{!accRec.Description}" label="Description"/>
            </apex:pageBlockSection>
            
            <apex:pageBlockSection title="Contact Information">
                <apex:inputField value="{!conRec.FirstName}" label="First Name"/>
                <apex:inputField value="{!conRec.LastName}" label="Last Name"/>
                <apex:inputField value="{!conRec.AccountId}" label="Account Id"/>
                <apex:inputField value="{!conRec.Email}" label="Email"/>
                <apex:inputField value="{!conRec.Phone}" label="Phone"/>
                <apex:inputTextarea value="{!conRec.Description}" label="Description"/>
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

ApexInputFieldController.apxc

// create ApexInputTextAreaController class to get the list of Accounts and Contacts
public class ApexInputTextAreaController {
    public Contact conRec{get;set;}
    public Account accRec{get;set;}
    
    public String recId {get;set;}
    
    //default constructor to retrieve contact Id from the page
    public ApexInputTextAreaController(ApexPages.StandardController controller){
        recId = controller.getRecord().Id;
        conRec = [Select Id, FirstName, LastName, AccountId, Email, Phone, Description From Contact Where Id =:recId];
        accRec = [Select Id, Name, AccountNumber, Phone, Rating, Website, Active__c, Description From Account where Id =:conRec.AccountId];
    }
}

Output