Laravel 框架的 HTML 和表单构建器

v2.0.1 2024-04-05 11:19 UTC

This package is not auto-updated.

Last update: 2024-09-20 13:24:57 UTC


README

Total Downloads Latest Stable Version License

Html

感谢 The Laravel Collective 创建原始的 package

安装

composer require tuijncode/html

重要

由于此包内部使用严格比较 (=== 而不是 ==),在将数值传递到您的表单时请谨慎。HTML 中的值作为字符串提交,Laravel 旧值存储在闪存会话中也是字符串。

在此示例中,此包将正确地插入单选输入中的 selected HTML 属性 - 因为传递的值 '1' 严格等于会话中旧提交的值 '1'

{{ Form::radio('category_id', '1') }} // '1' === '1' - comparing passed value and old session value

然而,在此示例中,传递的整数值 1 与会话中旧提交的字符串值 '1' 不严格相等,并且不会插入 selected HTML 属性

打开表单

打开表单

{!! Form::open(['url' => 'foo/bar']) !!}
    //
{!! Form::close() !!}

默认情况下,将假设 POST 方法;但是,您也可以指定另一个方法

{{ Form::open(['url' => 'foo/bar', 'method' => 'put']) }}

注意:由于 HTML 表单只支持 POSTGETPUTDELETE 方法将通过自动添加一个隐藏的 _method 字段来欺骗。

您还可以打开指向命名路由或控制器操作的表单

{{ Form::open(['route' => 'route.name']) }}

{{ Form::open(['action' => 'Controller@method']) }}

您还可以传递路由参数

{{ Form::open(['route' => ['route.name', $user->id]]) }}

{{ Form::open(['action' => ['Controller@method', $user->id]]) }}

如果您的表单将接受文件上传,请向您的数组中添加一个 files 选项

{{ Form::open(['url' => 'foo/bar', 'files' => true]) }}

CSRF 保护

将 CSRF 令牌添加到表单中

Laravel 提供了一种简单的方法来保护您的应用程序免受跨站请求伪造。首先,将一个随机令牌放置在您的用户会话中。如果您使用 Form::open 方法并带有 POSTPUTDELETE,CSRF 令牌将自动作为隐藏字段添加到您的表单中。或者,如果您希望生成隐藏 CSRF 字段的 HTML,可以使用 token 方法

{{ Form::token() }}

将 CSRF 过滤器附加到路由上

Route::post('profile',
    [
    'before' => 'csrf',
        function()
        {
            //
        }
    ]
);

表单模型绑定

打开模型表单

通常,您会想要根据模型的 内容来填充表单。要做到这一点,请使用 Form::model 方法

{{ Form::model($user, ['route' => ['user.update', $user->id]]) }}

现在,当您生成表单元素,如文本输入时,与字段名称匹配的模型的值将自动设置为字段值。例如,对于名为 email 的文本输入,用户模型的 email 属性将被设置为值。但是,还有更多!如果有与输入名称匹配的会话闪存数据项,它将优先于模型的值。优先级如下所示

  1. 会话闪存数据(旧输入)
  2. 显式传递的值
  3. 模型属性数据

这允许您快速构建不仅绑定到模型值,而且在服务器上发生验证错误时可以轻松重新填充的表单!

注意:使用 Form::model 时,请确保使用 Form::close 关闭您的表单!

表单模型访问器

Laravel的Eloquent访问器允许你在返回模型属性之前对其进行操作。这对于定义全局日期格式等非常有用。然而,用于显示的日期格式可能与用于表单元素的日期格式不匹配。你可以通过创建两个单独的访问器来解决此问题:一个标准访问器和一个表单访问器。

要定义表单访问器,在你的模型中创建一个名为的方法,其中是你希望访问的列的“骆驼式”命名。在这个例子中,我们将定义一个针对date_of_birth属性的访问器。当使用Form::model()尝试预填充表单字段时,HTML表单构建器会自动调用访问器。

你必须将FormAccessible特质包含在你的模型定义中才能使这生效。

<?php

namespace App;

use Carbon\Carbon;
use Illuminate\Database\Eloquent\Model;
use Tuijncode\Html\Eloquent\FormAccessible;

class User extends Model
{
    use FormAccessible;

    /**
     * Get the user's date of birth.
     *
     * @param  string  $value
     * @return string
     */
    public function getDateOfBirthAttribute($value)
    {
        return Carbon::parse($value)->format('m/d/Y');
    }

    /**
     * Get the user's date of birth for forms.
     *
     * @param  string  $value
     * @return string
     */
    public function formDateOfBirthAttribute($value)
    {
        return Carbon::parse($value)->format('Y-m-d');
    }
}

标签

生成标签元素

{{ Form::label('email', 'E-Mail Address') }}

指定额外的HTML属性

{{ Form::label('email', 'E-Mail Address', ['class' => 'awesome']) }}

注意:创建标签后,任何你创建的与标签名称匹配的表单元素将自动接收到与标签名称匹配的ID。

文本、文本区域、密码和隐藏字段

生成文本输入

{{ Form::text('username') }}

指定默认值

{{ Form::text('email', 'example@gmail.com') }}

注意:隐藏和textarea方法与文本方法具有相同的签名。

生成密码输入

{{ Form::password('password', ['class' => 'awesome']) }}

生成其他输入

{{ Form::email($name, $value = null, $attributes = []) }}
{{ Form::file($name, $attributes = []) }}

复选框和单选按钮

生成复选框或单选按钮输入

{{ Form::checkbox('name', 'value') }}
{{ Form::radio('name', 'value') }}

生成选中的复选框或单选按钮输入

{{ Form::checkbox('name', 'value', true) }}
{{ Form::radio('name', 'value', true) }}

数字

生成数字输入

{{ Form::number('name', 'value') }}

日期

生成日期输入

{{ Form::date('name', \Carbon\Carbon::now()) }}

文件输入

生成文件输入

{{ Form::file('image') }}

注意:必须将表单的files选项设置为true,才能打开表单。

下拉列表

生成下拉列表

{{ Form::select('size', ['L' => 'Large', 'S' => 'Small']) }}

生成具有选中默认值下拉列表

{{ Form::select('size', ['L' => 'Large', 'S' => 'Small'], 'S') }}

生成具有空占位符的下拉列表

这将创建一个没有值的元素作为下拉列表的第一个选项。

{{ Form::select('size', ['L' => 'Large', 'S' => 'Small'], null, ['placeholder' => 'Pick a size...']) }}

生成分组列表

{{ Form::select('animal',[
    'Cats' => ['leopard' => 'Leopard'],
    'Dogs' => ['spaniel' => 'Spaniel'],
]) }}

生成具有范围的下拉列表

{{ Form::selectRange('number', 10, 20) }}

生成包含月份名称的列表

{{ Form::selectMonth('month') }}

按钮

生成提交按钮

{{ Form::submit('Click Me!') }}

注意:需要创建按钮元素?试试button方法。它与submit具有相同的签名。

自定义宏

注册表单宏

定义名为“宏”的自定义表单类辅助方法很容易。下面是如何操作的。首先,只需使用给定的名称和闭包注册宏。

Form::macro('myField', function()
{
    return '<input type="awesome">';
});

现在你可以使用其名称调用你的宏

调用自定义表单宏

{{ Form::myField() }}

自定义组件

注册自定义组件

自定义组件与自定义宏类似,但是与使用闭包生成结果HTML不同,组件利用Laravel Blade模板。对于使用Twitter Bootstrap或任何其他前端框架的开发者,组件非常有用,这些框架需要额外的标记才能正确渲染表单。

让我们为简单的Bootstrap文本输入构建一个表单组件。你可能会考虑在Service Provider的boot方法中注册你的组件。

Form::component('bsText', 'components.form.text', ['name', 'value', 'attributes']);

注意我们如何引用视图路径。此外,我们提供的数组是组件的某种方法签名。这定义了将传递给视图的变量名称。你的视图可能看起来像这样

// resources/views/components/form/text.blade.php
<div class="form-group">
    {{ Form::label($name, null, ['class' => 'control-label']) }}
    {{ Form::text($name, $value, array_merge(['class' => 'form-control'], $attributes)) }}
</div>

自定义组件也可以以与在Form外观上相同的方式在Html外观上创建。

提供默认值

在定义你的自定义组件的方法签名时,你可以通过给数组项赋值来简单地提供默认值,如下所示

{{ Form::component('bsText', 'components.form.text', ['name', 'value' => null, 'attributes' => []]) }}

调用自定义表单组件

使用我们上面的例子(特别是提供默认值提供的例子),你可以像这样调用你的自定义组件

{{ Form::bsText('first_name') }}

这将生成如下HTML输出

<div class="form-group">
    <label for="first_name">First Name</label>
    <input type="text" name="first_name" value="" class="form-control">
</div>

生成URL

link_to

生成指向给定URL的HTML链接。

{{ link_to('foo/bar', $title = null, $attributes = [], $secure = null) }}

link_to_asset

生成指向给定资源的HTML链接。

{{ link_to_asset('foo/bar.zip', $title = null, $attributes = [], $secure = null) }}

link_to_route

生成指向给定命名路由的HTML链接。

{{ link_to_route('route.name', $title = null, $parameters = [], $attributes = []) }}

link_to_action

{{ link_to_action('HomeController@getIndex', $title = null, $parameters = [], $attributes = []) }}