eduardosaveiga / laravel-uikit-3-forms
Laravel 5 的 UIKit 3 表单构建器
dev-master
2018-09-20 18:14 UTC
This package is auto-updated.
Last update: 2024-09-21 20:23:10 UTC
README
这是一个用于在 Laravel 5 中创建 UIKit 3 风格表单元素的包。
特性
- 标签
- 错误信息
- UIKit 3 标记和类(包括状态、颜色和大小)
- 错误验证消息
- 表单填写(使用模型实例、数组或在表单提交后发生验证错误时)
- 国际化
- 使用 PHP 连接方法添加参数
- 无依赖(无 Laravel Collective 依赖)
介绍
之前
<div class="uk-margin"> <label class="uk-form-label" for="username">Username</label> <input type="text" class="uk-input @if ($errors->has('username')) uk-form-danger @endif " id="username" value="{{ old('username', $username) }}"> @if ($errors->has('username')) <span class="uk-label uk-label-danger"> <small>{{ $errors->first('username') }} </div> @endif </div>
之后
Form::text('username', 'Username')
安装
使用 Composer 安装包。
composer require eduardosaveiga/laravel-uikit-3-forms
Laravel 5.5 或更高版本
如果您正在使用 Laravel 5.5,自动发现功能将为您完成所有工作,您的工作就完成了,您现在就可以开始使用了。否则,请按照以下步骤进行安装。
Laravel 5.4
将服务提供者添加到您的 config/app.php 文件中
'providers' => [ //... EduardoVeiga\Uikit3Forms\Uikit3FormsServiceProvider::class, ],
将 BootForm 门面添加到 config/app.php 中的 aliases 数组
'aliases' => [ //... 'Form' => EduardoVeiga\Uikit3Forms\Uikit3FormsFacade::class, ],
用法
基本表单控件
打开和关闭表单
// Opening a form using POST method {!! Form::open() !!} // ... Form components here {!! Form::close() !!}
打开表单将自动为您添加 _token 字段
基本输入
文本输入
// Example {!! Form::text('name', 'User name') !!}
文本域
// Example {!! Form::textarea('description', 'Description') !!}
选择框
// Example {!! Form::select('city', 'Choose your city', [1 => 'Gotham City', 2 => 'Springfield']) !!}
复选框
// Example {!! Form::checkbox('orange', 'Orange') !!}
单选按钮
// Example {!! Form::radio('orange', 'Orange') !!}
范围
// Example {!! Form::range('like', 'Like', '2', '0', '20', '1') !!}
隐藏
// Example {!! Form::hidden('user_id') !!}
锚点
// Example {!! Form::anchor("Link via parameter", 'foo/bar') !!}
按钮
提交
// Example {!! Form::submit("Send form") !!}
按钮
// Example {!! Form::button("Do something") !!}
重置
// Example {!! Form::reset("Clear form") !!}
链式方法
本包使用 链式调用 功能,允许轻松传递更多参数。
填写表单
// Examples // With initial data using a Model instance $user = User::find(1); {!! Form::open()->fill($user) !!} // With initial array data $user = ['name' => 'Jesus', 'age' => 33]; {!! Form::open()->fill($user) !!}
URL
在锚点和表单打开中使用
// Example {!! Form::anchor("Link via url")->url('foo/bar') !!}
路由
在锚点和表单打开中使用
// Example {!! Form::anchor("Link via route")->route('home') !!}
选中
设置复选框/单选按钮的选中状态
// Examples // Using readonly field {!! Form::checkbox('agree', 'I agree')->checked() !!} // You can use FALSE to turn off checked status {!! Form::checkbox('agree', 'I agree')->checked(false) !!}
内联
设置复选框/单选按钮的选中状态
// Examples {!! Form::radio('orange', 'Orange')->inline() !!} {!! Form::checkbox('orange', 'Orange')->inline() !!}
占位符
// Example {!! Form::text('name', 'Name')->placeholder('Input placeholder') !!}
多选
// Example {!! Form::select('city', 'Choose your city', [1 => 'Gotham City', 2 => 'Springfield'])->multiple() !!}
区域设置
使用区域设置,该包将查找 resources/lang/{CURRENT_LANG}/forms/user.php 语言文件,并使用标签和帮助文本作为替换文本的键
// Example {!! Form::open()->locale('forms.user') !!} {!! Form::text('name', 'labels.name') !!}
帮助文本
// Examples // Conventional way {!! Form::text('name', 'Name')->help('Help text here') !!} // Using locale {!! Form::text('name', 'Name')->help('help.text') !!}
自定义属性
// Example {!! Form::text('name', 'Name')->attrs(['data-foo' => 'bar', 'rel'=> 'baz']) !!}
只读
// Examples // Using readonly field {!! Form::text('name', 'Name')->readonly() !!} // You can use FALSE to turn off readonly status {!! Form::text('name', 'Name')->readonly(false) !!}
禁用
// Examples // Disabling a field {!! Form::text('name', 'Name')->disabled() !!} // You can use FALSE to turn off disabled status {!! Form::text('name', 'Name')->disabled(false) !!}
完整
// Examples // Field and button at full size {!! Form::text('name', 'Name')->full() !!} {!! Form::button('name')->full() !!} // You can use FALSE to turn off block status {!! Form::text('name', 'Name')->full(false) !!}
图标
// Examples {!! Form::text('email', 'Email')->icon('mail') !!} {!! Form::button('send')->icon('check', true) !!}
标识符
// Example {!! Form::text('name', 'Name')->id('user-name') !!}
标识符前缀
所有标识符都将使用此前缀开头,例如:prefix-myid
// Example {!!Form::open()->prefix('register')!!}
多部分
// Examples {!! Form::open()->multipart() !!} // You can use FALSE to turn off multipart {!! Form::open()->multipart(false) !!}
方法
// Examples {!! Form::open()->method('get') !!} {!! Form::open()->method('post') !!} {!! Form::open()->method('put') !!} {!! Form::open()->method('patch') !!} {!! Form::open()->method('delete') !!}
颜色
// Examples {!! Form::button("Do something")->color('primary') !!} {!! Form::button("Do something")->color('secondary') !!}
大小
// Examples {!! Form::button("Do something")->size('small') !!} {!! Form::button("Do something")->size('large') !!}
类型
// Examples // Password field {!! Form::text('password', 'Your password')->type('password') !!} // Number field {!! Form::text('age', 'Your age')->type('number') !!} // Email field {!! Form::text('email', 'Your email')->type('email') !!}
名称
// Examples {!! Form::text('text')->name('name') !!}
标签
// Examples {!! Form::text('age')->label('Your age') !!}
默认值
// Example {!! Form::text('name', 'Your name')->value('Maria') !!}
渲染
// Examples // Number field {!! Form::render('text')->name('age')->label('Your age') !!}