mydnic / laravel-form-blade-components
Collection of Blade Components for Forms
Installs: 877
Dependents: 0
Suggesters: 0
Security: 0
Stars: 2
Watchers: 1
Forks: 1
Open Issues: 0
Language:HTML
Requires
- php: ^7.2
- laravel/framework: ^7.0
Requires (Dev)
- mockery/mockery: ^1.3
- orchestra/testbench: ^4.7.0
- phpunit/phpunit: ^8.5
README
We recommend the use of https://github.com/blade-ui-kit/blade-ui-kit
A Collection of Blade Components for Clean Forms
Installation
You can install this package via composer using this command:
composer require mydnic/laravel-form-blade-components
The package will automatically register itself
You then must publish the components with:
php artisan vendor:publish --provider="Mydnic\FormBladeComponents\FormBladeComponentsServiceProvider" --tag="blade-components"
This will copy the blade components in resources/views/components/form and will be automatically registered.
You can customize them the way you want.
Usage
In your blade views you can now add form elements in a very clean way.
Input
Include an <input>
element into your views.
@input([ 'name' => 'first_name', 'type' => 'text', 'label' => 'First Name', 'attributes' => 'required checked max="10"', 'placeholder' => 'Some placeholder', ])@endinput
Textarea
Include a <textarea>
element into your views.
@textarea([ 'name' => 'description', 'label' => 'Description', 'placeholder' => 'Some placeholder', ])@endtextarea
Checkbox
Include an <input type="checkbox">
element into your views.
@checkbox([ 'name' => 'is_enabled', 'label' => 'Enabled', 'object' => $user ])@endcheckbox
Select
Include a <select>
element into your views.
@select([ 'name' => 'user_id', 'label' => 'User', 'object' => $user, 'options' => $users ])@endselect
Pre Filling Values
By default the input are not filled with any value, like any empty input elements.
Force filling
You can force fill an attribute by providing a value
like this:
@input([ 'name' => 'first_name', 'label' => 'First Name', 'value' => 'Clément', ])@endinput
Object filling
You can fill an input value using an object attribute by providing an object
. This is very helpful when editing a resource.
@input([ 'name' => 'first_name', 'label' => 'First Name', 'object' => $user, ])@endinput
"Old" value filling
All components make use of the old()
helper from laravel, allowing the input to be filled in by previous value when submitting a form. This is done automatically and do not need any additional attribute.
Styling
You can customize the css classes on each element by editing the blade components once they are published.
By default, each element use some default classes:
Label (all components)
<label class="label"></label>
Input
Default state:
<input class="input">
Error state:
<input class="input error"> <p class="helper-error"></p>
Textarea
Default state:
<textarea class="textarea">
Error state:
<textarea class="textarea error"></textarea> <p class="helper-error"></p>
Checkbox
Default state:
<input type="checkbox" class="checkbox">
Error state:
<input type="checkbox" class="checkbox error"> <p class="helper-error"></p>
Select
Default state:
<select class="select"></select>
Error state:
<select class="select error"></select> <p class="helper-error"></p>