jeylabs / larastrap
Laravel 5 对 Bootstrap 3 的表单包装。
Requires
- php: >=5.4.0
- illuminate/config: ~5.0
- illuminate/session: ~5.0
- illuminate/support: ~5.0
- laravelcollective/html: ~5.0
Requires (Dev)
- mockery/mockery: 0.9.*
- phpunit/phpunit: ~4.6
This package is auto-updated.
Last update: 2024-08-29 04:31:02 UTC
README
这是一个用于在 Laravel 5 中简单地创建 Bootstrap 3 风格的表单组的包。它扩展了常规表单生成器,为您提供带有标签、错误信息和适当类使用的水平表单组。
简介
当您想要生成 Bootstrap 3 表单组时,只需将 BootstrapForm
外观类替换为 Form
外观类即可。
BootstrapForm::text('username');
您将得到以下内容
<div class="form-group">
<label for="username" class="control-label col-md-2">Username</label>
<div class="col-md-10">
<input type="text" name="username" class="form-control">
</div>
</div>
当然,如果该字段存在错误,它甚至会填充它们。
<div class="form-group has-error">
<label for="username" class="control-label col-md-2">Username</label>
<div class="col-md-10">
<input type="text" name="username" class="form-control">
<span class="help-block">The username field is required.</span>
</div>
</div>
安装
只需将此内容放入您的 composer.json
文件中,并运行 composer update
(无论您的 Composer 如何安装)。
"jeylabs/bootstrap-form": "dev-master"
现在,将这些服务提供者添加到您的 app/config/app.php
文件中。
'Collective\Html\HtmlServiceProvider',
'Jeylabs\BootstrapForm\BootstrapFormServiceProvider',
最后,将这些添加到别名数组中(注意:Form 和 Html 必须在 BootstrapForm 之前列出)
'Form'=> 'Collective\Html\FormFacade',
'HTML'=> 'Collective\Html\HtmlFacade',
'BootstrapForm' => 'Jeylabs\BootstrapForm\Facades\BootstrapForm',
如果您更喜欢更短的别名,可以自由地使用不同的别名来表示 BootstrapForm。
配置
BootstrapForm 有许多可用的配置选项。运行以下 Artisan 命令以发布配置选项到您的 config
目录
php artisan vendor:publish
水平表单大小
当使用水平表单时,您可以在此处指定左右列的默认大小。请注意,您可以指定每个列的任意多个类,以提高移动端的响应性,例如
col-md-3 col-sm-6 col-xs-12
显示错误
默认情况下,此包将仅显示每个字段的第一个验证错误。如果您希望列出字段的所有验证错误,只需将此配置选项设置为 true。
用法
打开表单
BoostrapForm 改进了打开表单的过程,包括提供 Bootstrap 类以及管理基于模型的表单的模型。
// Passing an existing, persisted model will trigger a model
// binded form.
$user = User::whereEmail('example@example.com')->first();
// Named routes
BootstrapForm::open(['model' => $user, 'store' => 'users.store', 'update' => 'users.update']);
// COntroller actions
BootstrapForm::open(['model' => $user, 'store' => 'UsersController@store', 'update' => 'UsersController@update']);
如果将模型传递给 open 方法,它将配置为使用 update
路由和 PUT
方法。否则,它将指向 store
方法作为 POST
请求。这样,您可以使用相同的打开标签来处理创建和保存。
// Passing a model that hasn't been saved or a null value as the
// model value will trigger a `store` form.
$user = new User;
BoostrapForm::open()
表单变体
有几个辅助函数可以打开不同的 Bootstrap 表单类型。默认情况下,open()
将使用配置文件中设置的表单样式。这些辅助函数与 open()
方法具有相同的输入。
// Open a vertical Bootstrap form.
BootstrapForm::openVertical();
// Open an inline Bootstrap form.
BootstrapForm::openInline();
// Open a horizontal Bootstrap form.
BootstrapForm::openHorizontal();
如果您想为表单更改列,以偏离配置文件中的设置,您也可以通过 $options
数组设置它们。
BootstrapForm::open(['left_column_class' => 'col-md-2', 'left_column_offset_clsas' => 'col-md-offset-2', 'right_column_class' => 'col-md-10'])
文本输入
以下是文本输入的各种方法。请注意,方法签名与 Laravel 表单生成器提供的签名相对接近,但需要一个表单标签参数。
// The label will be inferred as 'Username'.
BootstrapForm::text('username');
// The field name by default is 'email'.
BootstrapForm::email();
BootstrapForm::textarea('profile');
// The field name by default is 'password'.
BootstrapForm::password();
复选框和单选按钮输入
复选框和单选按钮有所不同,并生成不同的标记。它们支持输入的水平布局和内联布局。
查看方法签名以配置选项。
// A checked checkbox.
BootstrapForm::checkbox('interests', 'Laravel', 'laravel', true);
// An unchecked, but inline checkbox.
BootstrapForm::checkbox('interests', 'Rails', 'rails', null, true);
单选输入也是如此。
BootstrapForm::radio('gender', 'Male', 'male');
多个复选框和单选按钮
通过简单传递一个值/标签对的数组,您可以轻松生成一组复选框或单选按钮。
$label = 'this is just a label';
$interests = [
'laravel' => 'Laravel',
'rails' => 'Rails',
'ie6' => 'Internet Explorer 6'
];
// Checkbox inputs with Laravel and Rails selected.
BootstrapForm::checkboxes('interests', $label, $interests, ['laravel', 'rails']);
$genders = [
'male' => 'Male',
'female' => 'Female'
];
// Gender inputs inline, 'Gender' label inferred.
BootstrapForm::radios('gender', null, $genders, null, true);
// Gender inputs with female selected.
BootstrapForm::radios('gender', 'Gender', $genders, 'female');
提交按钮
// Pretty simple.
BootstrapForm::submit('Login');
关闭表单
// Pretty simple.
BootstrapForm::close();