silverstripe-framework/docs/en/02_Developer_Guides/03_Forms/06_Tabbed_Forms.md
Aaron Carlino 6888901468
NEW: Update docs to be compliant with Gatsby site (#9314)
* First cut

* Temporarily disable composer.json for netlify build

* POC

* New recursive directory query, various refinements

* Fix flexbox

* new styled components plugin

* Apply frontmatter delimiters

* Mobile styles, animation

* Search

* Redesign, clean up

* Nuke the cache, try again

* fix file casing

* Remove production env file

* ID headers

* Move app to new repo

* Add frontmatter universally

* Hide children changelogs

* Add how to title

* New callout tags

* Revert inline code block change

* Replace note callouts

* Fix icons

* Repalce images

* Fix icon

* Fix image links

* Use proper SQL icon
2019-11-18 17:58:33 +13:00

1.9 KiB

title summary
Tabbed Forms Find out how CMS interfaces use jQuery UI tabs to provide nested FormFields.

Tabbed Forms

SilverStripe's FormScaffolder can automatically generate Form instances for certain database models. In the CMS and other scaffolded interfaces, it will output TabSet and Tab objects and use jQuery Tabs to split parts of the data model.

[notice] All interfaces within the CMS such as ModelAdmin and LeftAndMain use tabbed interfaces by default. [/notice]

When dealing with tabbed forms, modifying the fields in the form has a few differences. Each Tab will be given a name, and normally they all exist under the Root TabSet.

[notice] TabSet instances can contain child Tab and further TabSet instances, however the CMS UI will only display up to two levels of tabs in the interface. [/notice]

Adding a field to a tab

$fields->addFieldToTab('Root.Main', new TextField(..));

Removing a field from a tab

$fields->removeFieldFromTab('Root.Main', 'Content');

Creating a new tab

$fields->addFieldToTab('Root.MyNewTab', new TextField(..));

Moving a field between tabs

$content = $fields->dataFieldByName('Content');

$fields->removeFieldFromTab('Root.Main', 'Content');
$fields->addFieldToTab('Root.MyContent', $content);

Add multiple fields at once

$fields->addFieldsToTab('Root.Content', [
    TextField::create('Name'),
    TextField::create('Email')
]);

API Documentation