Home » Posts filed under FlexForm

How to create flex form in extbase extenstion

If you are working with extbase extension development and you're in such a need that you want to provide customization options available from backend only then you can do it using flex form.

In the flex form you can provide many typos of input options as per your need. Like input text, textarea, rich content, likes etc.

For setting flex form you need to do below configuration in your extension. 


$extensionName = t3lib_div::underscoredToUpperCamelCase($_EXTKEY);
$pluginSignature = strtolower($extensionName) . '_pluginnameinsmalllatters';
(In place of  above red highlighted text, you have to put your name of plugin in small latters. )

$GLOBALS['TCA']['tt_content']['types']['list']['subtypes_addlist'][$pluginSignature] = 'pi_flexform';
t3lib_extMgm::addPiFlexFormValue($pluginSignature, 'FILE:EXT:' . $_EXTKEY . '/Configuration/FlexForms/flexform.xml');
(Configuration/FlexForms/flexform.xml is the path to your flex form xml.)



Now, you have to create a folder FlexForms in Configuration folder. Then you have to create flexfom.xml file in FlexForms folder.

For sample flex form, you can use below code :

<t3datastructure>
        <langdisable>1</langdisable>  
  <sheets>
   <sdef>
    <root>
     <tceforms>
      <sheettitle>General Settings</sheettitle>
     </tceforms>
     <type>array</type>
        <el>
                <settings .pageid="">
            <tceforms>
              <exclude>1</exclude>
              <label>Login page</label>
              <config>
                <type>group</type>
                <internal_type>db</internal_type>
                <allowed>pages</allowed>
                <size>1</size>
                <maxitems>1</maxitems>
                <minitems>0</minitems>
                <show_thumbs>1</show_thumbs>
              </config>
            </tceforms>
          </settings>
      </el>
     </root>
    </sdef>
   </sheets>
 </t3datastructure>

Now, you have to clear typo3temp folder (You can use the easy script cleartemp) and clear cache from backend.
You will have a link option in your backend once you use above flex form.

You can get the selected values in flex form by using below code :

$this->settings['pageid']

You can also use other flex form fields. Find more on below link :

http://typo3techie.blogspot.in/search/label/FlexForm

Thanks for reading the post. If you like this post then share with your friends. ENJOY !! :)
, 11:32 PM 1 comment
Labels: ,

TYPO3 FlexForm - Selectbox with Multiple selection Field

 You can use below code to get Selectbox with Multiple selection field in TYPO3 Flex Form:


<label>Selectbox with Multiple selection field</label>

<config>
<type>select</type>
<items type="array">

<numindex index="0" type="array">
<numindex index="0">choice 1</numindex>
<numindex index="1">value 1</numindex>
</numindex>

<numindex index="1" type="array">
<numindex index="0">choice 2</numindex>
<numindex index="1">value 2</numindex>
</numindex>

<numindex index="3" type="array">
<numindex index="0">choice 3</numindex>
<numindex index="1">value 3</numindex>
</numindex>

</items>
<maxitems>3</maxitems>
<size>3</size>
</config> 
11:47 PM 1 comment
Labels:

TYPO3 FlexForm - Selectbox field

You can use below code to get Selectbox field in TYPO3 Flex Form:


<label>Selectbox with fixed value field</label>
<config>
<type>select</type>
<items type="array">
<numIndex index="0" type="array">
<numIndex index="0">choice 1</numIndex>
<numIndex index="1">value 1</numIndex>
</numIndex>
<numIndex index="1" type="array">
<numIndex index="0">choice 2</numIndex>
<numIndex index="1">value 2</numIndex>
</numIndex>
<numIndex index="3" type="array">
<numIndex index="0">choice 3</numIndex>
<numIndex index="1">value 3</numIndex>
</numIndex>
</items>
</config>
11:45 PM No comments
Labels:

TYPO3 FlexForm - Radio Button Field

You can use below code to get Radio Buttons field in TYPO3 Flex Form :


<label>Radiobuttons</label>
<config>
  <type>radio</type>
  <items type="array">
    <numIndex index="0" type="array">
      <numIndex index="0">name1</numIndex>
      <numIndex index="1">value1</numIndex>
    </numIndex>
    <numIndex index="1" type="array">
      <numIndex index="0">name2</numIndex>
      <numIndex index="1">value2</numIndex>
    </numIndex>
    <numIndex index="3" type="array">
      <numIndex index="0">name3</numIndex>
      <numIndex index="1">value3</numIndex>
    </numIndex>
  </items>
</config>
11:42 PM 1 comment
Labels:

TYPO3 FlexForm - RTE Text editor Field


You can use below code to get RTE Text editor field in TYPO3 Flex Form :


<label>Textarea</label>
<config>
  <type>text</type>
  <cols>24</cols>
  <rows>3</rows>
  <defaultExtras>richtext[*]:rte_transform[mode=ts_css]</defaultExtras>
</config>
11:40 PM 2 comments
Labels:

TYPO3 FlexForm - Checkbox Field

You can use below code to get Checkbox field in TYPO3 Flex Form :


<label>Checkbox</label>
<config>
  <type>check</type>
</config>
11:38 PM No comments
Labels:

TYPO3 FlexForm - Date Field

You can use below code to get date field in TYPO3 Flex Form :


<label>Date field</label>
<config>
<type>input</type>
<size>8</size>
<max>8</max>
<eval>date</eval>
<checkbox>1</checkbox> </config>
11:37 PM No comments
Labels:

TYPO3 FlexForm - Text Area

You can use below code to get textarea in TYPO3 Flex Form :


<label>Textarea field</label>
<config>
<type>text</type>
<cols>24</cols>
<rows>3</rows>
</config>
11:36 PM No comments
Labels:

TYPO3 FlexForm - Text Field

You can use below code to get text field in TYPO3 Flex Form :

<label>Textfeld</label>
<config>
  <type>input</type>
  <size>20</size>
  <max>30</max>
  <eval>trim</eval>
</config>
11:34 PM No comments
Labels:

TYPO3 FlexForm

Flexform is generally used into Extension development to give better configuration option for Frontend Plugin.

It is also uses into TemplaVoila (TV) to setup main templates and Flexible Content Element (FCE).

Generally, whenever we are configuring Flexform - we have lack of all available all different type of fields/elements are available into Flexform configuration in the sense of Syntax.

There are many kind of XML configuration available like TextBox, Datefield, Checkbox, Textarea, Page tree, Link etc.

FlexForm Example :


<myFlexForm>
  <TCEforms>
    <label>Type of form</label>
    <onChange>reload</onChange>
    <config>
      <type>select</type>
      <size>1</size>
      <maxitems>1</maxitems>
      <items>
        <numIndex index="0" type="array">
          <numIndex index="0"></numIndex>
          <numIndex index="1">0</numIndex>
        </numIndex>
        <numIndex index="1" type="array">
          <numIndex index="0">Type No. 1 for texts</numIndex>
          <numIndex index="1">text</numIndex>
        </numIndex>
        <numIndex index="2" type="array">
          <numIndex index="0">Type No. 2 for images</numIndex>
          <numIndex index="1">image</numIndex>
        </numIndex>
      </items>
    </config>
  </TCEforms>
</myFlexForm>
11:30 PM No comments
Labels: