# How to use automatically rendered Bootstrap (4) forms with Nette Framework

Goal of this blog post is to give you quick introduction to contributte/forms-bootstrap (opens new window) package and how it can be used inside your project.

# Benefits

This package is build on top of nette forms and adds few interesting functionalities to nette forms.

Boostrap 4 renderer with 3 different render modes (vertical, inline and side by side)
Built-in AJAX support through ajaxproperty
All regular controls are extended with bootstrap-enabled controls
Grid support so you can render forms into multiple columns directly without manual rendering
Additional Date/DateTime inputs
Ability of assisted manual rendering (renders wholediv.form-group label, input and validation messages with one latte filter)

# Instalation

Best and easiest way to install package is with composer.

composer require contributte/forms-bootstrap

# Usage

It's pretty simmiliar to nette/forms (opens new window) with some additional features. This quick example:

$form->addText('title', 'Title')->setRequired();  
$form->addTextArea('content', 'Content', 50, 25);  
$form->addDateTime('start_date', 'Start date');   
$form->addSubmit('save', 'Save');

1
2
3
4

By default bootstrap theme would look something like that:

Try contributte/forms-bootstrap package →