README

BootForms

BootForms 是一个用于快速生成标准 Bootstrap 3 表单标记的 Laravel 扩展包。可能不适合您需要立即发布的高度定制品牌应用，但在原型设计阶段可以节省大量时间！

查看 Aire

此包已被 Aire 取代，Aire 是一个具有类似功能但改进了API、更多测试、更多文档以及对非Bootstrap主题支持的现代表单构建器。它默认使用 Tailwind，但通过插件完全支持Bootstrap。

BootForms 已不再积极维护。我将尝试合并未来可预见的任何错误修复，但我强烈建议您查看 Aire。

分支

此包分支了已废弃的 Adam Wathan 的存储库，以提供对较新 Laravel 版本的支持，并遵循原始包的变更

• 支持包自动发现
• 改进了对IDE自动完成的支撑（使用 laravel-ide-helper）
• 改进了对模型绑定的支撑
• 更改为仅适用于Laravel的包，以简化体验
• 停止支持低于5.5的Laravel版本

目录

• 安装
• 使用 BootForms
  • 基本用法
  • 自定义元素
  • 减少模板代码
  • 自动验证状态
  • 水平表单
  • 额外提示
• 相关资源

使用 Composer 安装

此包支持 Laravel 自动发现，因此您只需在项目的根目录中运行以下命令即可

composer require galahad/bootforms

使用 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');

有关更多信息，请参阅 基本 Forms 包 的文档。

减少模板代码

典型的 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()