DEPRECATION WARNING

This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.

Elements

Table of content:

The configuration of the element can be set with a table when creating the element

$form->add('my-element', 'text', array('placeholder' => 'My placeholder', 'class' => 'my-css-class'));

Or after instanciation

$form->add('my-element', 'text');
$form->get('my-element')->with('placeholder', 'My placeholder');

Button

Classic html button.

../_images/button.png

You can add a button like this

$form->add('my-button', 'button', $configuration);

Available configuration

Property Description Default value Example
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
label label of the button   click me!

Captcha

../_images/captcha.png

You can add a captcha like this

$form->add('my-captcha', 'captcha', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   Enter the code
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
errormessage Message if the captcha is not valid Captcha is not valid Captcha is not valid

Checkbox

../_images/checkbox.png

You can add a checkbox like this

$form->add('my-checkbox', 'checkbox', $configuration);

Available configuration

Property Description Default value Example
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
items avalaible choice for checkbox   array(‘1’ => ‘Item 1’, ‘2’ => ‘Item 2’);

Checksingle

../_images/checksingle.png

You can add a checksingle (yes/no choice) like this

$form->add('istrue', 'checksingle', $configuration);

Available configuration

Property Description Default value Example
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error

Color

../_images/color.png

You can add a input color like this. Work only with html5 browser.

$form->add('my-color-field', 'color', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error

Date

../_images/date.png

You can add a date like this.

$form->add('birthdate', 'date', $configuration);

Available configuration

Property Description Default value Example
class css class for the html tag   big
errorclass css class when there is an error   error
format-display sort field.d for day, m for month and y for year dmy dmy, mdy, ymd
year-minimum-limit minimum availaible year 1900 1970
year-maximum-limit maximum availaible year current year + 20 2050
format-output format of the result timestamp timestamp or format compatible with strftime

Datepicker

../_images/datepicker.png

You can add a date picker like this.

$form->add('startdate', 'datepicker', $configuration);

Available configuration

Property Description Default value Example
format date format (http://momentjs.com/docs/#/displaying/format/) D MMM YYYY MMM D YYYY
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error

Email

../_images/email.png

You can add a input email like this. Work only with html5 browser.

$form->add('my-email', 'email', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error

hidden

You can add a input hidden like this.

$form->add('my-hidden-field', 'hidden', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error

Number

../_images/number.png

You can add a input hidden like this. Work only with html5 browser.

$form->add('my-number-field', 'number', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
min minimum number   10
max maximum number   100
step increment step between each number 1 10

Password

../_images/password.png

You can add a input password like this.

$form->add('my-password', 'password', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
encrypt if true, password is encrypt false true
fill_value if true, add current value in html false true

Radio button

../_images/radio.png

You can add a checkbox like this

$form->add('my-radiobutton', 'radio', $configuration);

Available configuration

Property Description Default value Example
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
items avalaible choice for checkbox   array(‘1’ => ‘Item 1’, ‘2’ => ‘Item 2’);

Range

../_images/range.png

You can add a input hidden like this. Work only with html5 browser.

$form->add('my-range-field', 'range', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
min minimum number   10
max maximum number   100
step increment step between each number 1 10

Radio button

../_images/rating.png

You can add a rating element like this

$form->add('my-rating', 'rating', $configuration);

Available configuration

Property Description Default value Example
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
min score min 1 10
max score max 5 50
step step between score 1 2
label label of item  

ReCaptcha

../_images/recaptcha.png

You can add a recaptcha like this

$form->add('my-recaptcha', 'recaptcha', $configuration);

Available configuration

Property Description Default value Example
publicKey Your api public key (required)    
privateKey Your api private key (required)    
onload The name of your callback function to be executed once all the dependencies have loaded. (optional)    
render Whether to render the widget explicitly. Defaults to onload, which will render the widget in the first g-recaptcha tag it finds. (optional)    
language Forces the widget to render in a specific language. Auto-detects the user’s language if unspecified. (optional) Language codes: https://developers.google.com/recaptcha/docs/language en-GB    
theme The color theme of the widget (optional) light dark or light
type The type of CAPTCHA to serve (optional) image audio or image
size The size of the widget (optional) normal compact or normal
tabindex The tabindex of the widget and challenge (optional)    
callback The name of your callback function to be executed when the user submits a successful CAPTCHA response. The user’s response, g-recaptcha-response, will be the input for your callback function. (optional)    
expired-callback The name of your callback function to be executed when the recaptcha response expires and the user needs to solve a new CAPTCHA. (optional)    
errormessage Message if the captcha is not valid Captcha is not valid Captcha is not valid

Submit

../_images/submit.png

You can add a submit button like this

$form->add('my-button', 'submit', $configuration);

Available configuration

Property Description Default value Example
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
label label of the button   click me!

Tel

An input telephone field

../_images/tel.png

You can add a input tel like this

$form->add('my-tel', 'tel', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   Your telephone
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
datalist datalist for autocomplete   array(‘key-1’ => ‘value 1’, ‘key-2’ => ‘value 2’)
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
pattern regex for field control   ^((+d{1,3}(-| )?(?d)?(-| )?d{1,5})|((?d{2,6})?))(-| )?(d{3,4})(-| )?(d{4})(( x| ext)d{1,5}){0,1}$

Text

An input text field

../_images/text.png

You can add a input text like this

$form->add('my-text', 'text', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
datalist datalist for autocomplete   array(‘key-1’ => ‘value 1’, ‘key-2’ => ‘value 2’)
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error

Textarea

../_images/textarea.png

You can add a textarea like this

$form->add('my-textarea', 'textarea', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error

Upload

../_images/upload.png

You can add a textarea like this

$form->add('my-file', 'update', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   my firstname
style css style for the html tag   width: 150px;
title html tag title   my field title
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error
directory target upload directory   fileadmin/user_upload/my_ext/
filename target upload file name   my-file.pdf
canoverwrite if true, overwrite existing file   true or false
show_link if true, display an link to the file   true or false

Url

An input url field

../_images/url.png

You can add a input url like this

$form->add('my-url', 'url', $configuration);

Available configuration

Property Description Default value Example
placeholder place holder for the html tag   Your website
style css style for the html tag   width: 150px;
disabled true if the html field is disabled false true or false
title html tag title   my field title
datalist datalist for autocomplete   array(‘key-1’ => ‘value 1’, ‘key-2’ => ‘value 2’)
custom custom html attribute   customattr=”customvalue”
class css class for the html tag   big
errorclass css class when there is an error   error

Custom

You can also create your own form element.

$form->add('my-custom', 'Vendor\\Extension\\FormElements\\MyElement', $configuration)

Your php class must implement :

Ameos\AmeosForm\Elements\ElementInterface