README

从 YAML 和 JSON 快速构建表单，当需要大量输入字段以及频繁增减表单字段时。

安装

composer require "sujan/laraform"

由于 sujan/laraform 包基于 laravelcollective/html，您必须将您的新提供者添加到 config/app.php 的提供者数组中

'providers' => [
    // ...
    Sujan\LaraForm\ServiceProvider::class,
    Collective\Html\HtmlServiceProvider::class,
    // ...
],

最后，将两个类别名添加到 config/app.php 的别名数组中

'aliases' => [
    // ...
    'Form' => Collective\Html\FormFacade::class,
    'Html' => Collective\Html\HtmlFacade::class,
    // ...
],

然后运行以下命令

php artisan vendor:publish

它将在 /css/laraform.css 中为您提供 laraform.css 文件

然后像下面这样将 laraform.css 添加到您的母版模板中

<link rel="stylesheet" href="{{ asset('css/laraform.css') }}">

用法

此包具有多用途。您将获得 Laravel Collective 的所有功能以及 sujan/laraform 包的功能。我们基于现实场景开发了此包。

场景 1

假设您需要开发一个键值存储，其中所有应用程序设置都将驻留。关键是当需要时添加更多和更多的新键，但不需要修改代码。那么这个包就是您需要的。您只需编写一个 YAML 或 JSON 文件作为您的表单。

场景 2

假设您的设置值将作为嵌套对象提供，您需要为该对象制作一个表单，那么此包是一个不错的选择。它将在几分钟内为您构建表单，您只需根据 JSON 对象编写 JSON 或 YAML 文件。

如何使用

在表单标签内使用它，如

{{ Form::yaml("path/to/file.yml") }}
{{ Form::json("path/to/file.json") }}

Laraform 支持以下输入类型：text、email、password、number、hidden、date、file、textarea、checkbox、select、radio、checkboxlist、section；

示例 1

假设您有一个 users 表和一个 usersmeta 表。在 users 表中，您将保存 name、email、password，而在 usersmeta 表中，您想要保存 date_of_birth、color、gender、address、favourites、profile_pic。您的 yaml 和 json 文件将如下所示。其中 usermeta 是关系名称。我们的包将为您解析表单。

示例 1 的 YAML 示例

fields:
    name:
      label: Name
      type: text
      span: left
      
    email:
      label: Email
      type: email
      span: right
      
    password:
      label: Password
      type: password
      span: left
      
    password_confirmation:
      label: Confirm Password
      type: password
      span: right
      
    metadata:
      label: User Meta
      type: section
      
    usermeta[date_of_birth]:
      label: Date of Birth
      type: date
      span: left
      
    usermeta[color]:
      label: Choose Color
      type: select
      span: right
      options:
        "": Choose Color
        red: Red
        green: Green
        blue: Blue
        
    usermeta[gender]:
      label: Gender
      type: radio
      span: left
      options:
        male: Male
        female: Female
        other: Other
        
    usermeta[favourites][]:
      label: Favourites
      type: checkboxlist
      span: right
      options:
        cake: Cake
        apple: Apple
        mango: Mango
        
    usermeta[address]:
      label: Address
      type: textarea
      
    usermeta[profile_pic]:
      label: Upload profile picture
      type: file

示例 1 的 JSON 示例

{
  "fields": {
    "name": {
      "label": "Name",
      "type": "text",
      "span": "left"
    },
    "email": {
      "label": "Email",
      "type": "email",
      "span": "right"
    },
    "password": {
      "label": "Password",
      "type": "password",
      "span": "left"
    },
    "password_confirmation": {
      "label": "Confirm Password",
      "type": "password",
      "span": "right"
    },
    "metadata": {
      "label": "User Meta",
      "type": "section"
    },
    "usermeta[date_of_birth]": {
        "label": "Date of Birth",
        "type": "date",
        "span": "left"
    },
    "usermeta[color]": {
      "label": "Choose Color",
      "type": "select",
      "span": "right",
      "options": {
        "": "Choose Color",
        "red": "Red",
        "green": "Green",
        "blue": "Blue"
      }
    },
    "usermeta[gender]": {
      "label": "Gender",
      "type": "radio",
      "span": "left",
      "options": {
        "male": "Male",
        "female": "Female",
        "other": "Other"
      }
    },
    "usermeta[favourites][]": {
      "label": "Favourites",
      "type": "checkboxlist",
      "span": "right",
      "options": {
        "cake": "Cake",
        "apple": "Apple",
        "mango": "Mango"
      }
    },
    "usermeta[address]": {
      "label": "Address",
      "type": "textarea"
    },
    "usermeta[profile_pic]": {
      "label": "Upload profile picture",
      "type": "file"
    }
  }
}

在这里，span left 和 right 用于将输入字段推到左侧和右侧。如果您没有指定 span，则默认情况下 span 将填充整个空间。

示例创建表单

{{ Form::open(['method' => 'POST']) }}
{{ Form::yaml(/path/to/yaml/file) }}
{{ Form::submit('Submit', ['class' => 'form-control']) }}
{{ Form::close() }}

示例 YAML 和 JSON 的 HTML 表单。

表单验证规则

$this->validate($request, [
    'name' => 'required',
    'email' => 'required',
    'password' => 'required|confirmed',
    'usermeta.gender' => 'required',
    'usermeta.favourites' => 'required',
    'usermeta.address' => 'required',
    'usermeta.date_of_birth' => 'required',
    'usermeta.color' => 'required',
    'usermeta.profile_pic' => 'required|mimes:jpg,png',
],[
    'usermeta.address.required' => 'The address field is required.',
    'usermeta.favourites.required' => 'The favourites field is required.',
    'usermeta.date_of_birth.required' => 'The date of birth field is required.',
    'usermeta.color.required' => 'The color field is required.',
    'usermeta.gender.required' => 'The gender field is required.',
    'usermeta.profile_pic.required' => 'The profile picture field is required.',
]);

示例 YAML 和 JSON 的 HTML 表单，包含验证消息。

YAML 和 JSON 文件适用于创建和编辑页面，您只需传递模型实例或 JSON 对象。

示例编辑表单

{{ Form::model($model, ['method' => 'POST']) }}
{{ Form::yaml(/path/to/yaml/file) }}
{{ Form::submit('Submit', ['class' => 'form-control']) }}
{{ Form::close() }}

这里的变量 $model 是模型实例或 JSON 对象，如下所示。

示例 JSON 对象

{
    "name": "John Doe",
    "email": "john@example.com",
    "usermeta": {
        "date_of_birth": "2018-04-19",
        "color": "green",
        "gender": "male",
        "favourites": [
            "cake",
            "mango"
        ],
        "address": "No where"
    }
}

示例 JSON 对象的编辑表单

示例具有验证消息的编辑表单

上述对象的 YAML 和 JSON 文件将是 示例 1 的两个文件。

表单验证

您必须使用 Laravel 的表单验证方法。错误消息处理包含在包中。因此，您不需要编写显示错误消息的代码。消息将显示在标记为红色的输入字段下方。