PHPackages fab/quick-form - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. fab/quick-form ActiveTypo3-cms-extension[Utility & Helpers](/categories/utility) fab/quick-form ============== Generate quick form on the Frontend based on TCA 2.0.1(8y ago)31242[2 issues](https://github.com/fabarea/quick_form/issues)GPL-2.0+PHP Since Apr 24Pushed 7y agoCompare [ Source](https://github.com/fabarea/quick_form)[ Packagist](https://packagist.org/packages/fab/quick-form)[ Docs](https://github.com/fabarea/quick_form)[ RSS](/packages/fab-quick-form/feed)WikiDiscussions master Synced 1mo ago READMEChangelogDependenciesVersions (3)Used By (0) Quick Form for TYPO3 CMS ------------------------ [](#quick-form-for-typo3-cms) This is a TYPO3 CMS extension which allows to quickly build a form on the Frontend that corresponds to a data type describe by the TCA. The form can be used with an Extbase but not necessary. Installation ------------ [](#installation) Installation as "normal" in the Extension Manager. Configuration ------------- [](#configuration) Settings are done by TypoScript in EXT:quick\_form/Configuration/TypoScript/setup.txt. - key "partialExtension": - Tells where to find the Partials. Starting a new project it is encouraged to copy / paste the Partials from EXT:quick\_form into your own extension and adjust the HTML markup there. Make sure to respect the path convention. - default "quick\_form" - key "validate" - Configuration for form validation by TypoScript. - default empty View Helpers ------------ [](#view-helpers) ### Edit form [](#edit-form) There is a View Helper that will read the TCA configuration and will generate the form on the Frontend: ``` ``` Important to notice, the View Helper will not generate the form tag giving the full flexibility of the action and controller. In other words, the VH must be wrapped by a `f:form` tag as in the example: ``` # Regular Extbase Form ``` ### Show form (pre-visualisation) [](#show-form-pre-visualisation) For pre-visualisation needs, the `tca.show` can be used. It will display the visualisation (read-only) instead of the field for editing. ``` # tca.show != tca.form ``` Flexible Validation ------------------- [](#flexible-validation) Quick Form will show information on the Frontend whether the field contains validation. This is for now limited to: is required? has error after submit? It is configured to add a well-known "\*" to show the field is required. To get the validation info, Quick Form has three possible sources that can be configured with attribute "validation". If nothing is configured Quick Form will take the TCA as fallback which has the advantage to keep in sync the Backend and the Frontend. - `tca`: check validation against TCA, default - `typoscript`: Extbase makes it quite complicated to validate a model having different types. To work around typoscript validation can be used. Configuration must be given in `plugin.tx_quickform.validate` - `object`: use the object provided by context and use reflection to tell what fields are required. - `MyExtension\Domain\Model\Foo`: an object is not always available in the context. A model name can be provided. @todo add more validation output such as string length, email, ... TCA configuration ----------------- [](#tca-configuration) In file `EXT:sample/Configuration/TCA/tx_sample_domain_model_foo` make sure to have a section like: ``` # Adequate for "flat" structure. return array( 'quick_form' => array( '1' => 'first_name, last_name, ...', ), ``` TCA configuration can be more complex by accepting nested structure: ``` # Adequate for "nested" structure which contains field-set and other containers. return array( 'quick_form' => array( '1' => array( 'partial' => 'Form/FieldSet', 'items' => array( 'first_name', 'last_name', array( 'partial' => 'Form/Submit', ), ), ), ), ``` Quick Form also accepts a syntax with object that is a bit more concise than array and that is convenient when working with an IDE which auto-complete parameters: ``` # Usage of a Quick Form Component return array( 'quick_form' => array( '1' => array( 'partial' => 'Form/FieldSet', 'items' => array( 'first_name', 'last_name', new \Vanilla\QuickForm\Component\SubmitComponent() ), ), ), ``` Use "external" Partials ----------------------- [](#use-external-partials) Partials within EXT:quick\_start are taken as defaults. However, it is possible to use "external" Partials located in another extension: ``` new \Vanilla\QuickForm\Component\GenericComponent('Form/Foo', array('property' => 'propertyName', 'label' => 'fieldName'), 'foo'), ``` - The first parameter corresponds to the Partial Name - The second to the arguments - The third is the extension where the Partials come from Override label -------------- [](#override-label) In case the Frontend label must be different than in the BE, use option `alternative_label` in the arguments of the Form Component: ``` array( 'alternative_label' => 'LLL:EXT:bobst_forms/Resources/Private/Language/locallang.xlf:privacy_satement_label', ) ``` Quick Form Components --------------------- [](#quick-form-components) A list of all components that can be displayed in a Quick Form. Some of them are a bit more complex to set-up as they need a good TCA configuration along with a correct Extbase code. For those ones, there is code example given below. - Checkbox - CheckboxGroup (with example) - DatePicker (with example) - FieldSet - FileUpload (with example) - Hidden - MultiChoices (with example) - MultiSelect - Navigation - NavigationFirst - NavigationLast - NumberField - RadioButtons - Select - Separator - Submit - TabPanel - Text - TextArea - TextField - Todo (component for just showing some temporary message on the Frontend) ### CheckboxGroup [](#checkboxgroup) ``` array( 'partial' => 'Form/CheckboxGroup', 'arguments' => array('label' => 'wheels_or_tracks'), 'items' => array( 'operational_data_wheels', 'operational_data_tracks', ), ), ``` ### Checkbox [](#checkbox) If checkbox must be specially configured: ``` new \Vanilla\QuickForm\Component\CheckboxComponent( 'hasNewsletterSubscription', 'has_newsletter_subscription', array('group_label' => 'Newsletter') ), ``` #### TCA configuration [](#tca-configuration-1) ``` 'operational_data_wheels' => array( 'exclude' => 0, 'label' => 'LLL:EXT:ext/Resources/Private/Language/locallang_db.xml:tx_foo_domain_model_foo.operational_data_wheels', 'config' => array( 'type' => 'check', 'default' => '0' ), ), 'operational_data_tracks' => array( 'exclude' => 0, 'label' => 'LLL:EXT:ext/Resources/Private/Language/locallang_db.xml:tx_foo_domain_model_foo.operational_data_tracks', 'config' => array( 'type' => 'check', 'default' => '0' ), ), ``` #### Extbase code [](#extbase-code) ``` /** * @var int * @validate Integer */ protected $operationalDataWheels = 0; /** * @var int * @validate Integer */ protected $operationalDataTracks = 0; ``` ### DatePicker [](#datepicker) Some more JavaScript is required here. To be found a jQuery plugin for Bootstrap available in this repository in branch "bs3" as of this writing. ### Honey Pot [](#honey-pot) In TCA: ``` new \Vanilla\QuickForm\Component\HoneyPotComponent(), ``` In Extbase controller: ``` /** * @return void * @validate $request \Vanilla\QuickForm\Validator\HoneyPotValidator * @param \Vendor\Extension\Domain\Model\Foo $foo */ public function createAction(Foo $foo = NULL) { } ``` #### TCA configuration [](#tca-configuration-2) ``` 'available_on_market_from' => array( 'exclude' => 0, 'label' => 'LLL:EXT:ext/Resources/Private/Language/locallang_db.xml:tx_foo_domain_model_foo.available_on_market_from', 'config' => array( 'type' => 'input', 'size' => 12, 'max' => 20, 'eval' => 'date', 'default' => '0' ) ), ``` #### Extbase code [](#extbase-code-1) ``` /** * @var \DateTime */ protected $availableOnMarketFrom; ``` ### Multi Choice [](#multi-choice) ``` new \Vanilla\QuickForm\Component\MultiChoicesComponent('protectionLevel'), ``` #### TCA configuration [](#tca-configuration-3) ``` 'some_field' => array( 'exclude' => 0, 'label' => 'LLL:EXT:ext/Resources/Private/Language/locallang_db.xml:tx_foo_domain_model_foo.some_field', 'config' => array( 'type' => 'select', 'items' => array( array('', ''), array('LLL:EXT:ext/Resources/Private/Language/locallang_db.xml:tx_foo_domain_model_foo.some_field.label_1', '1'), array('LLL:EXT:ext/Resources/Private/Language/locallang_db.xml:tx_foo_domain_model_foo.some_field.label_2', '2'), ), 'size' => 4, 'maxitems' => 10, 'eval' => '' ), ), ``` #### Extbase code [](#extbase-code-2) Property: ``` /** * @var string */ protected $someField; ``` Beware, a special array-to-string converter must be defined in the Controller in order to convert the multi-choice to a CSV chain: ``` /** * Initialize object */ public function initializeAction() { // Configure property mapping. if ($this->arguments->hasArgument('objectName')) { /** @var \Vanilla\QuickForm\TypeConverter\ArrayToStringConverter $typeConverter */ $typeConverter = $this->objectManager->get('Vanilla\QuickForm\TypeConverter\ArrayToStringConverter'); $this->arguments->getArgument('request') ->getPropertyMappingConfiguration() ->forProperty('someField') ->setTypeConverter($typeConverter); } } ``` ### File Upload [](#file-upload) Suggested [EXT:media\_upload](https://github.com/fudriot/media_upload) to use the file upload API in your Extbase controller. ``` new \Vanilla\QuickForm\Component\FileUploadComponent('logo'), ``` ### Media Upload [](#media-upload) Require [EXT:media\_upload](https://github.com/fudriot/media_upload) which provides HTML5 file upload widget. ``` new \Vanilla\QuickForm\Component\MediaUploadComponent('logo'), ``` #### TCA configuration [](#tca-configuration-4) ``` 'logo' => array( 'exclude' => 0, 'label' => 'LLL:EXT:ext/Resources/Private/Language/locallang_db.xml:tx_ext_domain_model_organisation.logo', 'config' => \TYPO3\CMS\Core\Utility\ExtensionManagementUtility::getFileFieldTCAConfig( 'logo', array( 'appearance' => array( 'createNewRelationLinkTitle' => 'LLL:EXT:cms/locallang_ttc.xlf:images.addFileReference' ), 'minitems' => 0, 'maxitems' => 1, ), $GLOBALS['TYPO3_CONF_VARS']['GFX']['imagefile_ext'] ), ), ``` #### Extbase code [](#extbase-code-3) Property: ``` /** * @var \TYPO3\CMS\Extbase\Persistence\ObjectStorage */ protected $logo; ``` Accessor: ``` /** * @return \TYPO3\CMS\Extbase\Persistence\ObjectStorage */ public function getLogo() { return $this->logo; } /** * @param \TYPO3\CMS\Extbase\Persistence\ObjectStorage $logo */ public function setLogo($logo) { $this->logo = $logo; } /** * @param \TYPO3\CMS\Extbase\Persistence\ObjectStorage $logo * @return void */ public function addLogo(ObjectStorage $logo) { $this->logo->attach($logo); } /** * @param \TYPO3\CMS\Extbase\Persistence\ObjectStorage $logo * @return void */ public function removeLogo(ObjectStorage $logo) { $this->logo->detach($logo); } ``` ### Health Score 27 — LowBetter than 49% of packages Maintenance7 Infrequent updates — may be unmaintained Popularity15 Limited adoption so far Community7 Small or concentrated contributor base Maturity64 Established project with proven stability Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~0 days Total 2 Last Release 2947d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/9df52765d70098f094d02c41a2fda5b108b30ba7e58383dd79c5eda0f286dd21?d=identicon)[fudriot](/maintainers/fudriot) --- Top Contributors [![fabarea](https://avatars.githubusercontent.com/u/620730?v=4)](https://github.com/fabarea "fabarea (92 commits)") --- Tags formTYPO3 CMS ### Embed Badge ![Health badge](/badges/fab-quick-form/health.svg) ``` [![Health](https://phpackages.com/badges/fab-quick-form/health.svg)](https://phpackages.com/packages/fab-quick-form) ``` ### Alternatives [kartik-v/yii2-widget-datepicker Enhanced Yii2 wrapper for the bootstrap datepicker plugin (sub repo split from yii2-widgets). 1097.0M60](/packages/kartik-v-yii2-widget-datepicker)[kartik-v/yii2-widget-datetimepicker Enhanced Yii2 wrapper for the bootstrap datetimepicker plugin (sub repo split from yii2-widgets) 1036.5M47](/packages/kartik-v-yii2-widget-datetimepicker)[kartik-v/yii2-widget-depdrop Widget that enables setting up dependent dropdowns with nested dependencies (sub repo split from yii2-widgets) 814.9M18](/packages/kartik-v-yii2-widget-depdrop)[kartik-v/yii2-widget-timepicker Enhanced Yii2 wrapper for the bootstrap timepicker plugin (sub repo split from yii2-widgets) 404.9M14](/packages/kartik-v-yii2-widget-timepicker) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)