Nette extension for Bootstrap 4 forms
Please use English in potential issues, let's keep it clean, shall we?
This is a library that lets you use Bootstrap 4 forms in Nette framework.
Rather than being just a renderer, this introduces a custom set of controls (which covers all default controls) and a renderer.
Note that this is an alpha, so it may be buggy. That is where you can help by reporting issues.
- Fully valid Bootstrap 4 forms HTML generation
- All layout modes: vertical, side-by-side and inline
- TextInput placeholders
- Highly configurable renderer
- Custom Bootstrap controls
- DateTime picker, variety of human readable date/time formats, placeholder example generation
- Validation styles
The best way is via composer:
composer require czubehead/bootstrap-4-forms
Note that if you simply clone the main branch from this repo, it is not guaranteed to work, use releases instead
- Works with
Nette\Forms\Form, so you need the whole Nette framework.
- PHP 5.6+
- Client-side bootstrap 4 stylesheets and JS (obviously)
This package is compatible with any version version of Bootstrap 4 (last tested on v4.0.0-beta.2)
Probably the main class you will be using is
It has all the features of this library pre-configured and extends
Nette\Application\UI\Form functionality by:
- Only accepts
Czubehead\BootstrapForms\BootstrapRendereror its children (which is default)
- Built-in AJAX support (adds
ajaxclass upon rendering) via
- Has direct access to render mode property of renderer (property
- All add* methods are overridden by bootstrap-enabled controls
$form = new BootstrapForm; $form->renderMode = RenderMode::Vertical;
It will behave pretty much the same as the default Nette form
- Vertical (
Enums\RenderMode::VerticalMode) all controls are below their labels
- Side-by-side (
Enums\RenderMode::SideBySideMode) controls have their labels on the left. It is made up using Bootstrap grid. The default layout is 3 columns for labels and 9 for controls. This can be altered using
Enums\RenderMode::Inlineall controls and labels will be in one enormous line
Each default control has has been extended bootstrap-enabled controls and
will render itself correctly even without the renderer. You can distinguish
them easily - they all have
TextInput can have placeholder set (
$input->setPlaceholder($val)). All text-based
inputs (except for TextArea) inherit from this control.
Its format can be set (
$input->setFormat($str)), the default is d.m.yyyy h:mm
(though you must specify it in standard PHP format!).
You may use DateTimeFormats class constants as a list of pretty much all formats:
DateTimeFormat::D_DMY_DOTS_NO_LEAD . ' ' . DateTimeFormat::T_24_NO_LEAD
is the default format for DateTime. See its PhpDoc for further explanation.
Nothing out of ordinary, but it Needs
<html lang="xx"> attribute to work.
These can accept nested arrays of options.
[ 'sub' => [ 1 => 'opt1', 2 => 'opt2' ], 3 => 'opt3', ]
<optgroup label="sub"> <option value="1">opt1</option> <option value="2">opt2</option> </optgroup> <option value="3">opt3</option>
The renderer is enhanced by the following API:
|mode||see render mode above in form section|
|gridBreakPoint||Bootstrap grid breakpoint for side-by-side view. Default is 'sm'|
|groupInlineInputs||If consecutive inline elements, such as buttons should be grouped together. For list of elements, see