Bootstrap 4 forms for Laravel 5/6

This is a package for creating Bootstrap 4 styled form elements in Laravel 5/6.
Features
- Labels
- Error messages
- Bootstrap 4 markup and classes (including state, colors, and sizes)
- Error validation messages
- Form fill (using Model instance, array or after form submission when a validation error occurs)
- Internationalization
- Add parameters using php chaining approach
- Zero dependences (no Laravel Collective dependency)
Introduction
Before
After
Installation
Require the package using Composer.
Laravel 5.5 or above
If you is using Laravel 5.5, the auto discovery feature will make everything for you and your job is done, you can start using now. Else, follow the steps below to install.
Laravel 5.4
Add the service provider to your config/app.php file
Add the BootForm facade to the aliases array in config/app.php:
Usage
Basic form controls
Opening and closing a form
Opening the form will add _token field automatically for you
Inline form
Fieldset
| Param |
Type |
Default |
Description |
| \$legend |
string |
null |
Fieldset Legend |
Basic inputs
Text inputs
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$default |
string |
null |
Default value |
Textarea
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$default |
string |
null |
Default value |
Select
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$options |
array |
[] |
Select options |
| \$default |
string |
null |
Default value |
Options
| Param |
Type |
Default |
Description |
| \$options |
iterable |
[] |
Options list |
| \$valueKey |
string |
null |
key for value |
| \$idKey |
string |
null |
key for id |
Checkbox
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$value |
string |
null |
Input value |
| \$checked |
boolean |
null |
Default value |
Radio
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$value |
string |
null |
Input value |
| \$checked |
boolean |
null |
Default value |
File
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
Date inputs
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$default |
string |
null |
Default value |
Tel inputs
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$default |
string |
null |
Default value |
Time inputs
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$default |
string |
null |
Default value |
Time inputs
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$default |
string |
null |
Default value |
Range inputs
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$label |
string |
null |
Input label |
| \$default |
string |
null |
Default value |
Hidden
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
| \$default |
boolean |
null |
Default value |
Anchor
| Param |
Type |
Default |
Description |
| \$value |
string |
null |
Anchor text |
| \$url |
string |
null |
Anchor url |
Buttons
| Param |
Type |
Default |
Description |
| \$value |
string |
null |
Button value |
| \$color |
string |
null |
Button color |
| \$size |
string |
null |
button size |
Submit
Button
Reset
Chainable methods
This package uses chaining feature, allowing easly pass more parameters.
Filling a form
| Param |
Type |
Default |
Description |
| \$data |
object/array |
array |
Data fo fill form inputs |
Url
Use in anchors and forms openings
| Param |
Type |
Default |
Description |
| \$url |
string |
null |
Url |
Route
Use in anchors and forms openings
| Param |
Type |
Default |
Description |
| \$route |
string |
null |
Route name |
Error Bag
Use if you have more then one form per page. You set an identifier for each form, and the errors will be attached for that specific form
| Param |
Type |
Default |
Description |
| \$value |
string |
null |
Error bag name |
Errors
Show all errors inside a panel
| Param |
Type |
Default |
Description |
| \$title |
string |
null |
Panel title |
Disable validation messages
Disable success/error status and validation error message
| Param |
Type |
Default |
Description |
| \$disabled |
boolean |
false |
Disabled status |
Checked
Set the checkbox/radio checked status
| Param |
Type |
Default |
Description |
| \$checked |
boolean |
true |
Checked status |
Inline
Set the checkbox/radio checked status
Placeholder
| Param |
Type |
Default |
Description |
| \$placeholder |
string |
null |
Placeholder text |
Select Multiple
Locale
Using locale, the package will look for a resources/lang/{CURRENT_LANG}/forms/user.php language file and uses labels and help texts as keys for replace texts
Help Text
| Param |
Type |
Default |
Description |
| \$text |
string |
null |
Help text |
Custom attributes
| Param |
Type |
Default |
Description |
| \$attrs |
array |
[] |
Custom input attributes |
Custom attributes in wrapper div (\
...\
)
| Param |
Type |
Default |
Description |
| \$attrs |
array |
[] |
Custom input attributes |
Readonly
| Param |
Type |
Default |
Description |
| \$status |
boolean |
true |
Read only status |
Disabled
| Param |
Type |
Default |
Description |
| \$status |
boolean |
true |
Disabled status |
Block
| Param |
Type |
Default |
Description |
| \$status |
boolean |
true |
Disabled status |
Required
| Param |
Type |
Default |
Description |
| \$status |
boolean |
true |
Required status |
AutoFill
| Param |
Type |
Default |
Description |
| \$value |
string |
'on' |
autocomplte value |
see: https://html.spec.whatwg.org/multipage/forms.html#autofill
If no autocomplete value is specified on the form, html spec requires
a default value of 'on'. So, you must explicitly turn it off.
Autocomplete values will be automatically generated for fields with
single word names matching valid values (e.g. name, email, tel, organization). The
complete list is in the spec mentioned above.
Id
| Param |
Type |
Default |
Description |
| \$id |
string |
null |
Id field |
Id prefix
| Param |
Type |
Default |
Description |
| \$prefix |
string |
null |
Id prefix |
Multipart
| Param |
Type |
Default |
Description |
| \$multipart |
boolean |
true |
Multipart flag |
Method
| Param |
Type |
Default |
Description |
| \$method |
string |
null |
HTTP method |
explicit HTTP verbs
Color
| Param |
Type |
Default |
Description |
| \$color |
string |
null |
Color name |
explicit color
Size
| Param |
Type |
Default |
Description |
| \$size |
string |
null |
Size name |
Explicit size
Type
| Param |
Type |
Default |
Description |
| \$type |
string |
null |
Type field |
Min
| Param |
Type |
Default |
Description |
| \$value |
number |
null |
Minimum value |
Set min attribute for input
Max
| Param |
Type |
Default |
Description |
| \$value |
number |
null |
Minimum value |
Set max attribute for input
Name
| Param |
Type |
Default |
Description |
| \$name |
string |
null |
Input name |
Label
| Param |
Type |
Default |
Description |
| \$label |
string |
null |
Input label |
Default Value
| Param |
Type |
Default |
Description |
| \$value |
mixed |
null |
Input value |
Render
| Param |
Type |
Default |
Description |
| \$render |
string |
null |
Render name |
Disable is-valid CSS Class
| Param |
Type |
Default |
Description |
| \$disableIsValid |
boolean |
true |
Disable is-valid CSS class |
Chaining properties
You can use chaining feature to use a lot of settings for each component