webup / laravel-form
A Laravel package to help build forms.
Installs: 6 251
Dependents: 1
Suggesters: 0
Security: 0
Stars: 14
Watchers: 9
Forks: 4
Open Issues: 1
Requires
- php: >=5.3.0
- illuminate/support: ~5.1|^6.0|^7.0|^8.0|^9.0|^10.0|^11.0
Requires (Dev)
- phpunit/phpunit: 4.*
- scrutinizer/ocular: ~1.1
README
Install
Step 1: Install via Composer
$ composer require webup/laravel-form
Step 2: Add the Service Provider
Add this line to config/app.php:
'providers' => [ //... Webup\LaravelForm\FormServiceProvider::class ]
Step 3: Use Facade (optional)
For shorter code, you can use the facade by adding this line to config/app.php:
'aliases' => [ //... 'Form' => Webup\LaravelForm\Facades\Form::class, ]
You can now use Laravel Form directly into your views (check some examples bellow)
Step 4: Publish config
You can publish config and override it in config/form.php:
php artisan vendor:publish
Using
Methods
These methods can be used with any type of elements:
- label($label = null, $escape = true)
- value($value = null)
- placeholder($placeholder = null)
- name($name = null)
- required($showStar = true)
- errors($errors = [])
- attr(array $attr = [])
- wrapperAttr(array $attr = [])
- wrapperClass($wrapperClass) deprecated use wrapperAttr(['class' => 'myclass'])
Generated HTML
{!! Form::create('text', 'name') ->label('Name') ->value('Barney') ->required() ->attr(['maxlenght' => '50']) ->wrapperAttr(['class' => 'f-custom-class']) !!}
Without errors:
<div class="f-group f-custom-class"> <label for="name">Name <i class="f-required">*</i></label> <input type="text" id="name" name="name" value="Barney" maxlength="50"> </div>
With errors (retrieve from Laravel validation):
<div class="f-group f-custom-class f-error"> <label for="name">Name <i class="f-required">*</i></label> <input type="text" id="name" name="name" value="Barney" maxlength="50"> <ul class="f-error-message"> <li>Name is required</li> </ul> </div>
You can override default CSS class in config/form.php.
Important: Laravel Form can handle HTML generation and client side validation only. You need to manage server side validation on your own.
Elements
input
{!! Form::create('email', 'name') ->label('Email') ->value('homer.simpson@example.com') ->placeholder('example@adresse.com') ->required() ->wrapperAttr(['class' => 'custom-class']) !!}
textarea
{!! Form::create('textarea', 'name') ->label('Name') ->value('Nullam id dolor id nibh ultricies vehicula ut id elit.') !!}
radio
{!! Form::create('radio', 'gender')->label('Gender') ->addRadio(1, 'Male', 'male') ->addRadio(0, 'Female', 'female') ->wrapperAttr(['class' => 'custom-class']) ->value(0) !!}
Specific methods :
- addRadio($value, $label, $id, $attr = [])
select
{!! Form::create('select', 'fruits') ->label("Fruits") ->placeholder("What's your favorite?") ->addOptions(['apple' => 'Apple', 'strawberry' => 'Strawberry', 'melon' => 'Melon']) ->value('apple') !!}
Specific methods :
- addOptions(array $options)
checkbox
{!! Form::create('checkbox', 'cgu') ->label("I accept the general terms and conditions") ->value(true) !!}
You can use ->attr(['value' => '1'])
to change the value of the checkbox
AntiSpam feature
Honeypot
{!! Form::honeypot("unicorn_mail") !!}
Will create an input text
with name='unicorn_mail'
within a hidden div (by javascript)
Validation
$request->validate([ [...] 'unicorn_mail' => 'honeypot', ]);
TimeTrap
{!! Form::timetrap("unicorn_time") !!}
Will create an input text
with name='unicorn_time'
and value="{encryptedTimestamp}"
within a hidden div (by javascript)
Validation
$request->validate([ [...] 'unicorn_time' => 'timetrap:2', ]);
In this example, timetrap time is set to 2
seconds. If no value is set, config form.antiSpam.minFormSubmitTime
is taken. Finally if config form.antiSpam.minFormSubmitTime
is not set, default value is 3
seconds.
Styling
Bellow, you will find default styles that can work with Laravel Form.
.f-group { margin-bottom: 1rem; } .f-group label { margin-bottom: .5rem; } .f-required { color: #c0392b; font-weight: bold; } .f-error input { border: 1px solid #c0392b; } .f-error-message { margin-top: 4px; color: #c0392b; }
Contributing
Please see CONTRIBUTING and CONDUCT for details.
Credits
Developed by Agence Webup
License
The MIT License (MIT). Please see License File for more information.