Form.textarea ViewHelper <f:form.textarea>

ViewHelper which renders a <textarea> large text input area inside a form.

The value of the text area needs to be set via the value attribute, as with all other f:form ViewHelpers.

Go to the source code of this ViewHelper: Form\TextareaViewHelper.php (GitHub).

A basic text area bound to an action argument

This example shows how to bind a textarea to an Extbase controller action argument.

This approach is appropriate when you want to handle input directly in a controller action, without relying on a domain model or Data Transfer Object (DTO).

packages/my_extension/Resources/Private/Templates/Contact/ShowForm.html
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
      data-namespace-typo3-fluid="true">

<f:form action="sendMessage" controller="Contact" method="post">

    <label for="tx-contact-name">Your Name:</label>
    <f:form.textfield name="name" id="tx-contact-name" required="true" />
    <label for="tx-contact-message">Message:</label>
    <f:form.textarea name="message" id="tx-contact-message" required="true" />

    <f:form.submit class="button" value="Send" />
</f:form>

</html>
Copied!

The controller action can then look like this:

packages/my_extension/Classes/Controller/ContactController.php
<?php

declare(strict_types=1);

namespace MyVendor\MyExtension\Controller;

use Psr\Http\Message\ResponseInterface;
use TYPO3\CMS\Extbase\Mvc\Controller\ActionController;

class ContactController extends ActionController
{
    public function sendMessageAction(string $name, string $message): ResponseInterface
    {
        // Process data
        $this->addFlashMessage('Your message was received.');
        return $this->redirect('showForm');
    }
    // ...
}
Copied!

Property binding: A text area bound to a model property

Using the property argument, a text field can be bound to the property of an Extbase model.

For this, the surrounding form must also define the object property. As the textarea ViewHelper may provide texts longer than 255 chars, the TCA for the field should be of type Text areas & RTE. This ensures that the auto-generated database field will also be of type TEXT, which is suitable for longer content.”

packages/my_extension/Resources/Private/Templates/Blog/Comment.html
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
      data-namespace-typo3-fluid="true">

<f:form action="create"
        controller="Comment"
        objectName="comment"
        object="{newComment}"
        method="post">

        <label for="tx-blogexample-email">E-Mail:</label>
        <f:form.textfield property="email"
                          type="email"
                          id="tx-blogexample-email" />

        <label for="tx-blogexample-content">Message:</label>
        <f:form.textarea property="content"
                         id="tx-blogexample-content"
                         rows="8"
                         cols="46" />

        <f:form.submit class="button"
                       value="Submit" />

</f:form>
</html>
Copied!

The controller action can then look like this:

packages/my_extension/Classes/Controller/CommentController.php
<?php

declare(strict_types=1);

namespace MyVendor\MyExtension\Controller;

use Psr\Http\Message\ResponseInterface;
use T3docs\BlogExample\Domain\Model\Comment;
use T3docs\BlogExample\Domain\Repository\CommentRepository;
use TYPO3\CMS\Extbase\Annotation\IgnoreValidation;
use TYPO3\CMS\Extbase\Mvc\Controller\ActionController;

class CommentController extends ActionController
{
    public function __construct(
        protected readonly CommentRepository $commentRepository,
    ) {}

    #[IgnoreValidation(['argumentName' => 'newComment'])]
    public function commentFormAction(?Comment $newComment = null): ResponseInterface
    {
        if ($newComment === null) {
            $newComment = new Comment();
            $newComment->setDate(new \DateTime());
        }
        // The assigned object will be used in argument object
        $this->view->assign('newComment', $newComment);
        return $this->htmlResponse();
    }

    public function createAction(
        // This parameter must have the same name as argument `objectName` of f:form
        Comment $comment,
    ): ResponseInterface {
        $this->commentRepository->add($comment);
        $this->addFlashMessage('Comment was saved');
        return $this->redirect('show');
    }
}
Copied!
packages/my_extension/Classes/Domain/Model/Comment.php
<?php

declare(strict_types=1);

namespace MyVendor\MyExtension\Domain\Model;

use TYPO3\CMS\Extbase\Annotation\Validate;
use TYPO3\CMS\Extbase\DomainObject\AbstractEntity;

class Comment extends AbstractEntity
{
    #[Validate(['validator' => 'EmailAddress'])]
    protected string $email = '';

    #[Validate(['validator' => 'StringLength', 'options' => ['maximum' => 500]])]
    protected string $content = '';

    // Getters and setters ...
}
Copied!
packages/my_extension/Configuration/TCA/tx_myextension_domain_model_comment.php
<?php

return [
    'ctrl' => [
        'title' => 'Comment',
        'label' => 'email',
        // ...
    ],
    'types' => [
        '1' => ['showitem' => 'email, content'],
    ],
    'columns' => [
        'email' => [
            'label' => 'Email',
            'config' => [
                'type' => 'email',
            ],
        ],
        'content' => [
            'label' => 'Message',
            'config' => [
                'type' => 'text',
            ],
        ],
    ],
];
Copied!

Arguments of the textarea form field ViewHelper

additionalAttributes

additionalAttributes
Type
array
Additional tag attributes. They will be added directly to the resulting HTML tag.

aria

aria
Type
array
Additional aria-* attributes. They will each be added with a "aria-" prefix.

data

data
Type
array
Additional data-* attributes. They will each be added with a "data-" prefix.

errorClass

errorClass
Type
string
Default
'f3-form-error'
CSS class to set if there are errors for this ViewHelper

name

name
Type
string
Name of input tag

property

property
Type
string
Name of Object Property. If used in conjunction with <f:form object="...">, the "name" property will be ignored, while "value" can be used to specify a default field value instead of the object property value.

required

required
Type
bool
Default
false
Specifies whether the textarea is required

value

value
Type
mixed
Value of input tag