srmklive/ bootforms
一个带有一些Bootstrap特定便利性的表单构建器。记住旧输入,检索错误信息,并自动处理所有你的Bootstrap模板标记。
Requires
- php: >=5.6.4
- illuminate/support: ~5.1|~5.2|~5.3|~5.4|~5.5|~5.6|~5.7|~5.8
Requires (Dev)
- mockery/mockery: ~0.9|~1.0
- phpunit/phpunit: ~5.7|~6.0|~7.0
This package is auto-updated.
Last update: 2024-09-10 01:46:29 UTC
README
简介
此插件允许您在Laravel应用程序中快速生成表单。
致谢
此软件包是基于bootforms(由Adam Wathan维护)的分支,后者不再积极维护。
使用Composer安装
您可以通过在项目的根目录下终端运行此命令来使用Composer安装此包:
composer require srmklive/bootforms
Laravel
如果您正在使用Laravel 5或更高版本,您可以通过注册包含的服务提供程序来快速开始。
修改config/app.php
中的providers
数组以包含BootFormsServiceProvider
'providers' => [ //... Srmklive\BootForms\BootFormsServiceProvider::class ],
将BootForm
外观添加到config/app.php
中的aliases
数组
'aliases' => [ //... 'BootForm' => Srmklive\BootForms\Facades\BootForm::class ],
现在您可以通过直接在BootForm
外观上调用方法来开始使用BootForms
BootForm::text('Email', 'email');
使用BootForms
基本用法
BootForms允许您通过一个调用创建标签和表单控件,并将它们全部包装在表单组中。
// <form method="POST"> // <div class="form-group"> // <label for="field_name">Field Label</label> // <input type="text" class="form-control" id="field_name" name="field_name"> // </div> // </form> {!! BootForm::open() !!} {!! BootForm::text('Field Label', 'field_name') !!} {!! BootForm::close() !!}
注意:在尝试创建字段之前,别忘了使用
open()
打开表单!BootForms需要在渲染字段之前知道您是否打开了垂直或水平表单,所以如果您忘记,您将收到一个错误。
自定义元素
如果您需要以任何方式自定义表单元素(例如,向文本元素添加默认值或占位符),只需链式调用您需要执行的操作,它们将传递到底层的表单元素。
可以通过attribute
方法添加属性,或者简单地使用属性名作为方法名。
// <div class="form-group"> // <label for="first_name">First Name</label> // <input type="text" class="form-control" id="first_name" name="first_name" placeholder="John Doe"> // </div> BootForm::text('First Name', 'first_name')->placeholder('John Doe'); // <div class="form-group"> // <label for="color">Color</label> // <select class="form-control" id="color" name="color"> // <option value="red">Red</option> // <option value="green" selected>Green</option> // </select> // </div> BootForm::select('Color', 'color')->options(['red' => 'Red', 'green' => 'Green'])->select('green'); // <form method="GET" action="/users"> BootForm::open()->get()->action('/users'); // <div class="form-group"> // <label for="first_name">First Name</label> // <input type="text" class="form-control" id="first_name" name="first_name" value="John Doe"> // </div> BootForm::text('First Name', 'first_name')->defaultValue('John Doe');
减少模板代码
典型的Bootstrap表单模板代码可能看起来像这样:
<form> <div class="form-group"> <label for="first_name">First Name</label> <input type="text" class="form-control" name="first_name" id="first_name"> </div> <div class="form-group"> <label for="last_name">Last Name</label> <input type="text" class="form-control" name="last_name" id="last_name"> </div> <div class="form-group"> <label for="date_of_birth">Date of Birth</label> <input type="date" class="form-control" name="date_of_birth" id="date_of_birth"> </div> <div class="form-group"> <label for="email">Email address</label> <input type="email" class="form-control" name="email" id="email"> </div> <div class="form-group"> <label for="password">Password</label> <input type="password" class="form-control" name="password" id="password"> </div> <button type="submit" class="btn btn-default">Submit</button> </form>
BootForms为您做了一些决定,并允许您进一步缩减它
{!! BootForm::open() !!} {!! BootForm::text('First Name', 'first_name') !!} {!! BootForm::text('Last Name', 'last_name') !!} {!! BootForm::date('Date of Birth', 'date_of_birth') !!} {!! BootForm::email('Email', 'email') !!} {!! BootForm::password('Password', 'password') !!} {!! BootForm::submit('Submit') !!} {!! BootForm::close() !!}
自动验证状态
BootForms的另一个优点是,如果它在错误存储中看到某个控件有错误,它会自动将错误状态和错误消息添加到控件中。
实质上,这会将通常看起来像这样的代码
<div class="form-group {!! $errors->has('first_name') ? 'has-error' : '' !!}"> <label for="first_name">First Name</label> <input type="text" class="form-control" id="first_name"> {!! $errors->first('first_name', '<p class="help-block">:message</p>') !!} </div>
并缩减为这样
{!! BootForm::text('First Name', 'first_name') !!}
...如果会话中有错误,则自动添加has-error
类。
水平表单
要使用水平表单而不是标准基本表单,只需将BootForm::open()
调用与openHorizontal($columnSizes)
调用交换即可
// Width in columns of the left and right side // for each breakpoint you'd like to specify. $columnSizes = [ 'sm' => [4, 8], 'lg' => [2, 10] ]; {!! BootForm::openHorizontal($columnSizes) !!} {!! BootForm::text('First Name', 'first_name') !!} {!! BootForm::text('Last Name', 'last_name') !!} {!! BootForm::text('Date of Birth', 'date_of_birth') !!} {!! BootForm::email('Email', 'email') !!} {!! BootForm::password('Password', 'password') !!} {!! BootForm::submit('Submit') !!} {!! BootForm::close() !!}
其他技巧
隐藏标签
您可以通过从任何元素定义中链式调用hideLabel()
辅助函数来隐藏标签。
BootForm::text('First Name', 'first_name')->hideLabel()
标签仍然会在标记中生成,但会使用Bootstrap的.sr-only
类隐藏,这样您就不会降低表单的可访问性。
帮助块
您可以使用helpBlock()
辅助函数在表单元素下方添加帮助块。
BootForm::text('Password', 'password')->helpBlock('一个强壮的密码应该很长且难以猜测。')
注意:如果有验证错误,此帮助块将被错误覆盖。
模型绑定
BootForms使绑定对象到表单以提供默认值变得容易。有关更多信息,请参阅此处。
BootForm::open()->action( route('users.update', $user) )->put() BootForm::bind($user) BootForm::close()
相关资源
- Laravel 可翻译 BootForms,集成了 BootForms 和 Dimsav 的 Laravel 可翻译 包