laravolt / semantic-form
Semantic UI form helpers
Installs: 12 878
Dependents: 4
Suggesters: 0
Security: 0
Stars: 52
Watchers: 7
Forks: 10
Open Issues: 1
Requires
- php: >=7.3
- illuminate/support: ^6.0
- jenssegers/date: ^3.4
- myclabs/deep-copy: ^1.9
- nesbot/carbon: ^2.0
Requires (Dev)
- mockery/mockery: ^1.2
- php-coveralls/php-coveralls: ^2.1
- phpunit/phpunit: ^8.0
- squizlabs/php_codesniffer: ^3.4
Suggests
- laravolt/platform: Some semantic-form components only works in Laravolt Platform
- dev-master / 4.1.x-dev
- v4.0.2
- v4.0.1
- 2.x-dev
- 2.14.3
- 2.14.2
- 2.14.1
- 2.14.0
- 2.13.3
- 2.13.2
- 2.13.1
- 2.13.0
- 2.12.0
- 2.11.2
- 2.11.1
- 2.11.0
- 2.10.1
- 2.10.0
- 2.9.0
- 2.8.5
- 2.8.4
- 2.8.3
- 2.8.2
- 2.8.1
- 2.8.0
- 2.7.0
- 2.6.1
- 2.6.0
- 2.5.0
- 2.4.1
- 2.4.0
- 2.3.1
- 2.3.0
- 2.2.2
- 2.2.1
- 2.2.0
- 2.1.6
- 2.1.5
- 2.1.4
- 2.1.3
- 2.1.2
- 2.1.1
- 2.1.0
- 2.0.1
- 2.0.0
- 1.x-dev
- 1.11.1
- 1.11.0
- 1.10.8
- 1.10.7
- 1.10.6
- 1.10.5
- 1.10.4
- 1.10.3
- 1.10.2
- 1.10.1
- 1.10
- 1.9.4
- 1.9.3
- 1.9.2
- 1.9.1
- 1.9.0
- 1.8.0
- 1.7.0
- 1.6.0
- 1.5.1
- 1.5.0
- 1.4.0
- 1.3.0
- 1.2.0
- 1.1.1
- 1.1.0
- 1.0.2
- 1.0.1
- 1.0.0
- 0.x-dev
- 0.1
- dev-tabular-form
- dev-array-renderer
This package is auto-updated.
Last update: 2024-10-30 01:53:42 UTC
README
Semantic UI form builder, for Laravel.
Installation
$ composer require laravolt/semantic-form
API
Note: You can use either facade Form::method()
or helper form()->method()
.
Opening Form
Form::open('search'); // action="search" Form::open()->get(); Form::open()->post(); Form::open()->put(); Form::open()->patch(); Form::open()->delete(); Form::open(); // default to method="GET" Form::open()->action('search'); Form::open()->url('search'); // alias for action() Form::open()->route('route.name'); Form::open()->post()->action(route('comment.store'));
Opening Form (Short Syntax, Since 1.10)
Form::open('search'); // action="search" method=POST Form::get('search'); // action="search" method=GET Form::post('search'); // action="search" method=POST Form::put('search'); // action="search" method=POST _method=PUT Form::patch('search'); // action="search" method=POST _method=PATCH Form::delete('search'); // action="search" method=POST _method=DELETE
CSRF Token
CSRF token will automatically generated if current form method is POST
. To prevent token generation,
you can call withoutToken()
when opening a form.
Form::post('search')->withoutToken();
Text
Form::text($name, $value)->label('Username');
Number
Form::number($name, $integerValue)->label('Total');
Rupiah
Form::rupiah($name, $defaultValue = null)->label('Price');
Date
Form::date($name, $value)->label('Birthday');
Time
Form::time($name, $value)->label('Start Time');
Password
Form::password($name)->label('Password');
Form::email($name, $value)->label('Email Address');
Textarea
Form::textarea($name, $value)->label('Note');
Select Box (Dropdown)
Form::select($name, $options)->label('Choose Country'); Form::select($name, $options, $selected)->label('Choose Country'); Form::select($name, $options)->placeholder('--Select--'); Form::select($name, $options)->appendOption($key, $label); Form::select($name, $options)->prependOption($key, $label);
Select Date & Select Date Time
Form::selectDate('myDate', $startYear, $endYear)->label('Birth Date'); Form::selectDateTime('myDate', $startYear, $endYear, $intervalInMinute)->label('Schedule');
By default, selectDate and selectDateTime will post request as _myDate
with ['date'=>4, 'month'=>5, 'year'=>2016]
for example.
To get 2016-5-4
format, you need to register middleware and use it in the routes.
protected $routeMiddleware = [ 'selectdate' => \Laravolt\SemanticForm\Middleware\SelectDateMiddleware::class, 'selectdatetime' => \Laravolt\SemanticForm\Middleware\SelectDateTimeMiddleware::class ];
Route::post('myForm', ['middleware' => ['web', 'selectdate:myDate'], function (\Illuminate\Http\Request $request) { dd($request->input('myDate')); // Will output 2016-5-4 }]);
Select Range
Form::selectRange($name, $begin, $end)->label('Number of child');
Select Month
Form::selectMonth($name, $format = '%B')->label('Month');
Radio
$checked = true; Form::radio($name, $value, $checked)->label('Item Label');
Radio Group
$values = ['apple' => 'Apple', 'banana' => 'Banana']; $checkedValue = 'banana'; Form::radioGroup($name, $values, $checkedValue)->label('Select Fruit');
Checkbox
Form::checkbox($name, $value, $checked)->label('Remember Me');
Checkbox Group
$values = ['apple' => 'Apple', 'banana' => 'Banana']; $checkedValue = 'banana'; Form::checkboxGroup($name, $values, $checkedValue)->label('Select Fruit');
File
Form::file($name);
Input Wrapper
Form::input($name, $defaultvalue); Form::input($name, $defaultvalue)->appendIcon('search'); Form::input($name, $defaultvalue)->prependIcon('users'); Form::input($name, $defaultvalue)->appendLabel($label); Form::input($name, $defaultvalue)->prependLabel($label); Form::input($name, $defaultvalue)->type("password");
Reference: http://semantic-ui.com/elements/input.html
Datepicker
Form::datepicker($name, $value, $format); // Valid $format are: // DD -> two digit date // MM -> two digit month number // MMMM -> month name (localized) // YY -> two digit year // YYYY -> full year // To convert localized format to standard (SQL) datetime format, you can use Jenssegers\Date\Date library (already included): // Jenssegers\Date\Date::createFromFormat('d F Y', '12 februari 2000')->startOfDay()->toDateTimeString(); // Jenssegers\Date\Date::createFromFormat('d F Y', '12 februari 2000')->startOfDay()->toDateString();
Timepicker
Form::timepicker($name, $value);
Hidden
Form::hidden($name, $value);
Button
Form::button($value);
Submit
Form::submit($value);
Model Binding
Version 1
{!! Form::bind($model) !!}
Version 2
// as parameter for method open() {!! Form::open($route, $model) !!} // or chaining it {!! Form::bind($model)->get($route) !!}
Warning
// This is OK in version 1, but will produce error in version 2 {!! Form::bind($model) !!}
Macro
Macro definition, put it anywhere within your application, e.g. AppServiceProvider:
Form::macro('trix', function ($id, $name, $value = null) { return sprintf( "%s %s", Form::hidden($name, $defaultValue)->id($id), "<trix-editor input='{$id}'></trix-editor>" ); });
And then call it like any other method:
Form::trix('contentId', 'content', '<b>some content</b>');
Action
// Method 1 Form::action(Form::submit('Save'), Form::button('cancel')); // Method 2 // Assumed you already define some macros: Form::macro('submit', function(){ return form()->submit('Submit'); }); Form::macro('cancel', function(){ return form()->button('Cancel'); }); // Then you can just call macro name as string Form::action('submit', 'cancel'); // Method 3 // Even further, you can define macro thats just wrap several buttons: SemanticForm::macro('default', function(){ return new \Laravolt\SemanticForm\Elements\Wrapper(form()->submit('Submit'), form()->submit('Submit')); }); // And then make the call simplier: Form::action('default');
General Function
For every form element, you can call and chaining following methods:
- id($string)
- addClass($string)
- removeClass($string)
- attribute($name, $value)
- data($name, $value)
- hint($text) (Since 1.10.0)
- hint($text, $class = "hint") (Since 1.10.2)
Override Hint class globally (Since 1.10.2)
// Put this on every request, e.g. in AppServiceProvider Laravolt\SemanticForm\Elements\Hint::$defaultClass = 'custom-class';
Example
Form::text($name, $value)->label('Username')->id('username')->addClass('foo'); Form::text($name, $value)->label('Username')->data('url', 'http://id-laravel.com'); Form::password($name, $value)->label('Password')->hint('Minimum 6 characters'); Form::password($name, $value)->label('Password')->hint('Minimum 6 characters', 'my-custom-css-class');
Middleware
- \Laravolt\SemanticForm\Middleware\SelectDateMiddleware
- \Laravolt\SemanticForm\Middleware\SelectDateTimeMiddleware
Credits
SemanticForm inspired by AdamWathan\Form.