e0ipso/schema-forms

从 JSON Schema 属性定义和显示配置创建表单定义。


README

Schema forms 是一个项目,旨在根据 JSON Schema 中的数据定义生成不同 PHP 框架的表单结构。

支持的框架

  • Drupal.

使用方法

给定以下 JSON Schema,它定义了用户对象的各个属性。

{
  "title": "A registration form",
  "description": "A simple form example.",
  "type": "object",
  "required": [
    "firstName",
    "lastName"
  ],
  "properties": {
    "firstName": {
      "type": "string",
      "title": "First name",
      "default": "Chuck"
    },
    "lastName": {
      "type": "string",
      "title": "Last name"
    },
    "age": {
      "type": "integer",
      "title": "Age",
      "description": "(earthian year)"
    },
    "bio": {
      "type": "string",
      "title": "Bio"
    },
    "password": {
      "type": "string",
      "title": "Password",
      "minLength": 3,
      "description": "The key to get in."
    },
    "telephone": {
      "type": "string",
      "title": "Telephone",
      "minLength": 10
    }
  }

以及以下 UI JSON Schema,它细化了表单生成过程

{
  "firstName": {
    "ui:autofocus": true,
    "ui:emptyValue": ""
  },
  "age": {
    "ui:widget": "updown",
    "ui:title": "Age of person"
  },
  "bio": {
    "ui:widget": "textarea"
  },
  "password": {
    "ui:widget": "password",
    "ui:help": "Hint: Make it strong!"
  },
  "date": {
    "ui:widget": "alt-datetime"
  },
  "telephone": {
    "ui:options": {
      "inputType": "tel"
    }
  }
}

执行以下 PHP 代码

use SchemaForms\Drupal\FormGeneratorDrupal;
$generator = new FormGeneratorDrupal();
$context = new Context(['ui_hints => $ui_schema_data]);
$actual_form = $generator->transform($schema_data, $context);
// It generates the following Drupal Form API form:
[
  'firstName' => [
    '#type' => 'textfield',
    '#title' => 'First name',
    '#required' => TRUE,
  ],
  'lastName' => [
    '#type' => 'textfield',
    '#title' => 'Last name',
    '#required' => TRUE,
  ],
  'age' => [
    '#type' => 'number',
    '#title' => 'Age of person',
    '#description' => '(earthian year)'
  ],
  'bio' => [
    '#type' => 'textarea',
    '#title' => 'Bio',
  ],
  'password' => [
    '#type' => 'password',
    '#title' => 'Password',
    '#description' => 'Hint: Make it strong!'
  ],
  'telephone' => [
    '#type' => 'telephone',
    '#title' => 'Telephone',
  ],
];

UI 模式数据

根据 JSON Schema 描述的数据形状,该库可以生成表单。但是,对于相同形状的数据,有多种生成表单的方式。UI 模式数据允许您控制以适当方式收集数据的表单元素和输入。

支持的 UI 控件有

  • $ui_form_data['ui:title']

    控制与输入元素关联的标签。默认为 JSON Schema 中元素的 title 属性。

  • $ui_form_data['ui:help']

    向输入元素添加提示。默认为 JSON Schema 中元素的 description 属性。

  • $ui_form_data['ui:placeholder']

    向输入添加占位文本。

  • $ui_form_data['ui:widget']

    允许您使用替代输入元素。例如,它允许您使用 <select> 而不是 <input type="radio">,或者使用 <input type="hidden"> 等。

  • $ui_form_data['ui:enabled']

    如果为 0,则表单元素将以非交互方式呈现。

  • $ui_form_data['ui:visible']

    如果为 0,则表单元素将不会呈现。

  • $ui_form_data['ui:enum']

    允许您定义如何填充选择和单选按钮的选项。默认情况下,模式中的枚举信息定义了选项。这可能不够,甚至不可能。

    • $ui_form_data['ui:enum']['labels']['mappings']

    定义每个键的标签的对象。例如:{"uuid1": "超级产品"}