1. Go to this page and download the library: Download occ2/form-control library. Choose the download type require.
2. Extract the ZIP file and open the index.php.
3. Add this code to the index.php.
<?php
require_once('vendor/autoload.php');
/* Start to develop here. Best regards https://php-download.com/ */
occ2 / form-control example snippets
namespace MyApp\Controls;
use occ2\form-control\FormControl;
/**
* @ajax
* @title app.myForm.title
* @comment app.myForm.comment
* @styles (headerBackground="light",headerText="dark",size="w-100")
*/
final class MyForm extends FormControl{
/**
* @type hidden
*/
public $id;
/**
* @leftAddon app.myForm.username
* @rightIcon user
* @type text
* @cols 20
* @validator (type=':filled',message='user.error.:pattern',message='user.error.patternPassword',value='.*(?=.*[0-9])(?=.*[a-z])(?=.*[A-Z]).*')
* @description app.myForm.passwordDescription
*/
public $password;
/**
* @type recaptcha
*/
public $recaptcha;
/**
* @label app.myForm.submit
* @type submit
*/
public $submit;
}
#### b. Create control factory interface for example in IMyForm.php
namespace MyApp\Controls;
interface IMyForm{
/**
* @return \MyApp\Controls\MyForm
*/
public function create();
}
#### c. Register factory of Form and Renderer in your config.neon
services:
formFactory: \app\Base\controls\FormControl\factories\FormFactory(@Nette\Localization\ITranslator)
- \MyApp\Controls\IMyForm
#### d. Now you can use factory in your presenter - for example in UserPresenter.php
namespace MyApp\Presenters;
use Nette\Application\UI\Presenter as NPresenter,
Nette\Application\UI\Form as NForm;
final class UserPresenter extends NPresenter{
/**
* @inject @var \MyApp\Controls\IMyForm
*/
public $myFormFactory;
/**
* @return \MyApp\Controls\MyForm
*/
public function createComponentMyForm{
$t = $this;
$f = $this->myFormFactory->create();
$f->onSuccess[] = function(NForm $form)use($t){
$values = $form->getValues();
......
if($t->isAjax()){
$t["myForm"]->flashMessage("Success..");
$t["myForm"]->reload();
}
else{
$t->redirect("this");
}
};
return $f;
}
}
#### e. Add your form into template - for example default.latte
{block content}
{control myForm}
## 3. Setup FORM structure
Structure of form is set by properties. One form control = one property (property name =control name)). All settings, and layout of form can be set by class annotations. All settings and layout of cntrols are set by property annotations. Be carefull that some property names are reserved ($name, $parent,$presenter, $params, $snippetMode, $linkCurrent, $template and all that begins by $_) and cannot be used as control name.
#### a. FORM settings and layout
These are set by annotation of form class. Here is list of them..
_@ajax - AJAXify form (set form class ajax)_
_@title - set form card heading (in Bootstrap4 card) - translatable text_
_@comment - set form comment (placed between form controls and header)- translatable text_
_@footer - set form footer (placed under form controls)- translatable text_
_@styles - array of form Bootstrap card CSS classes_
_@rControl - array of control renderer wrappers_
_@rForm - array of form renderer wrappers_
_@rError - array of error renderer wrappers_
_@rGroup - array of group renderer wrappers_
_@rControls - array of controls renderer wrappers_
_@rPair - array of pair renderer wrappers_
_@rLabel - array of label renderer wrappers_
_@rHidden - array of hidden renderer wrappers_
_@links- add link to footer (array contains link, class and text)_
_@onSubmit - Symfony event fired while click on submit button_
_@onError - Symfony event fired while error add_
_@onValidate - Symfony event fired while validation needed_
_@onSuccess - Symfony event fired while valid form send_
#### b. CONTROLs settings and layout
These are set by annotations of form properties. Property name is set as control name. Here is list of annotation settings.
_@type - set type of control
Avalilable type are hidden, text email, number, password, textarea, select, multiselect, checkbox, checkboxlist, radiolist, upload, multiupload, submit, recaptcha_
_@label - set control label (translatable)_
_@cols - set number of cols in control - available for TextInput and TextArea_
_@rows - set number of rows - available for TextArea_
_@description - set translatable control description (small text under contol)_
_@leftAddon - set left addon translatable text in control_
_@leftIcon - set left addon icon in control - conflicts with leftAddon_
_@rightAddon - set right addon translatable text in control_
_@rightIcon - set right addon icon in control - conflicts with rightAddon_
_@placeholder - set translatable control placeholder_
_@maxlength - set maximal length of control text_
_@caption - set translatable caption text to checkbox_
_@multiple - set multiple uploader_
_@
Loading please wait ...
Before you can download the PHP files, the dependencies should be resolved. This can take some minutes. Please be patient.