How to ad data dynamically to a TYPO3 form finisher's select field (in form editor and in plugin override)

Expert [addtoany]

Sep '24

Adding data dynamically to a TYPO3 form finisher's select field can be done both in the form editor and through a plugin override. Below are detailed steps and code examples for each approach.

1. Adding Data Dynamically in the Form Editor

To add data dynamically to a select field in TYPO3's form editor, you can use TypoScript and the FormFinisher configuration. Here’s a detailed approach:

Steps:

Create or Edit Your Form:
- In the TYPO3 backend, navigate to the Form module.
- Either create a new form or edit an existing one.
Add a Select Field:
- Add a new field of type select in your form.
Configure the Select Field:
- To populate this field dynamically, you'll need to use a custom TypoScript configuration.
Use TypoScript for Dynamic Data:
- You need to define a TypoScript object to fetch dynamic data for your select field.

Example TypoScript Configuration:

Example


plugin.tx_form {
    settings {
        yaml {
            # Other configurations...
            form {
                elements {
                    your_select_field {
                        type = select
                        options {
                            # Fetch options dynamically via TypoScript
                            10 = TEXT
                            10 {
                                value = Dynamic Option 1
                            }
                            20 = TEXT
                            20 {
                                value = Dynamic Option 2
                            }
                        }
                    }
                }
            }
        }
    }
}

In this example, your_select_field should be replaced with the actual identifier of your select field. The options array is where you dynamically define your options. For truly dynamic content, you might need to use a TypoScript or Fluid template to generate options from database queries or external sources.

2. Adding Data Dynamically in a Plugin Override

To add data dynamically to a select field programmatically through a plugin override, you can create a custom form finisher in TYPO3.

Steps:

Create a Custom Form Finisher:
First, create a custom form finisher by extending the base class AbstractFinisher in your extension.
Implement the Custom Finisher:
Create a file, e.g., Classes/Form/Finisher/DynamicSelectFinisher.php, in your TYPO3 extension.

Example Code for Custom Finisher:

Example


<?php
namespace Vendor\Extension\Form\Finisher;

use TYPO3\CMS\Form\Domain\Finisher\AbstractFinisher;
use TYPO3\CMS\Form\Domain\Model\FinisherContextInterface;
use TYPO3\CMS\Core\Utility\GeneralUtility;

class DynamicSelectFinisher extends AbstractFinisher
{
    /**
     * @inheritDoc
     */
    public function finish(FinisherContextInterface $finisherContext): void
    {
        // Access the form's data
        $formValues = $finisherContext->getFormValues();

        // Fetch dynamic data (e.g., from database)
        $dynamicOptions = $this->getDynamicOptions();

        // Modify select field options dynamically
        $formValues['your_select_field'] = $dynamicOptions;

        // Update form values
        $finisherContext->setFormValues($formValues);
    }

    /**
     * Fetch dynamic options
     *
     * @return array
     */
    protected function getDynamicOptions(): array
    {
        // Example: Fetch options from the database or an external API
        $options = [];
        $result = GeneralUtility::makeInstance(\TYPO3\CMS\Core\Database\ConnectionPool::class)
            ->getConnectionForTable('your_table')
            ->select(
                ['uid', 'title'],
                'your_table',
                [],
                [],
                ['title' => 'ASC']
            );

        while ($row = $result->fetchAssociative()) {
            $options[$row['uid']] = $row['title'];
        }

        return $options;
    }
}

Register Your Custom Finisher:

Example


// ext_localconf.php
if (!isset($GLOBALS['TYPO3_CONF_VARS']['FORM']['finisher'])) {
    $GLOBALS['TYPO3_CONF_VARS']['FORM']['finisher'] = [];
}

$GLOBALS['TYPO3_CONF_VARS']['FORM']['finisher']['dynamic_select_finisher'] = \Vendor\Extension\Form\Finisher\DynamicSelectFinisher::class;

Configure Your Form to Use the Custom Finisher:

In the YAML configuration of your form, specify the custom finisher.

Example


finishers:
  - 
    identifier: dynamic_select_finisher
    options:
      # Any additional options for your finisher

Summary

In the Form Editor: Use TypoScript to define dynamic options for the select field.
Through Plugin Override: Create a custom finisher that dynamically modifies the select field options based on data fetched from the database or an external source.

This approach provides flexibility for dynamically populating select fields in TYPO3 forms both via the backend form editor and through custom coding.

How to ad data dynamically to a TYPO3 form finisher's select field (in form editor and in plugin override)