Generating form's HTML
Form's HTML is generated using render method of \Ip\Form object. That means you have to create a form object first, then add some fields, and, finally, render a form.
Create and render a form
<?php // Create a form object $form = new \Ip\Form(); // Add a text field to form object $field = new \Ip\Form\Field\Text( array( 'name' => 'firstField', // HTML "name" attribute 'label' => 'First field', // Field label that will be displayed next to input field )); $form->addField($field); $formHtml = $form->render(); return $formHtml; // Output a string with generated HTML form
Fieldsets
Fieldsets can be used to group form fields, by drawing a box around the related elements.
Group input fieldS using fieldsets
<?php $form->addFieldset(new \Ip\Form\Fieldset('My fieldset 1')); $form->addField($field1); $form->addField($field2); $form->addField($field3); $form->addFieldset(new \Ip\Form\Fieldset('My fieldset 2')); $form->addField($field4); $form->addField($field5); $form->addField($field6);
Forms in admin / public interface context
Forms have different look, texts and error messages in admin and public interfaces. E.g., your website might be translated to many different languages, while administration user interface is likely to be in website editor's native language. Also, due to ImpressPages nature, you might see widget admin forms mixed with website's public forms. When you create \Ip\Form object, ImpressPages tries to guess in which context you are creating the form. In case autodetection fails, you can set the right environment manually:
Set form's environment TO ADMIN
<?php $form->setEnvironment(\Ip\Form::ENVIRONMENT_ADMIN); ?>
Set form's environment TO PUBLIC
<?php $form->setEnvironment(\Ip\Form::ENVIRONMENT_PUBLIC); ?>
Overriding form's default HTML
You can override HTML for all forms by overriding view files in override/Ip/Form/publicView and override/Ip/Form/adminView directories.
Or pass a custom view file to a specific theme:
<?php $view = ipView('view/customFormView.php'); $formHtml = $form->render($view); ?>
Setting field layout
Each in put field on ImpressPages is surrounded by some additional HTML which gives freedom to style form using CSS. Label, error, notes, etc. are printed alongside. You can control it by overriding form's view files (see above) or use field layout. There are three layouts available:
- \Ip\Form\Field:LAYOUT_DEFAULT
- \Ip\Form\Field:LAYOUT_NO_LABEL
- \Ip\Form\Field:LAYOUT_BLANK
Set the layout as follow
$field = new \Ip\Form\Field\Text( array( 'layout' => \Ip\Form\Field::LAYOUT_NO_LABEL, 'name' => 'firstField', // HTML "name" attribute ) );
Dynamically created forms
If you create form dynamically after page's onReady event, use ipInitForms() function to initialize form's JavaScript validation and JavaScript related form fields such as \Ip\Form\Field\File, \Ip\Form\Field\RichText, \Ip\Form\Field\Color, etc.
If you have your own custom Form field that rely on JavaScript, initialize that javascript on ipInitForms event
$(document).on('ipInitForms', function () { $('.ipsModuleFormAdmin .type-syourcustomfieldtype').yourFieldInitializationJQueryFunction(); })