pablosanches/form-builder

一个简单的库,可以轻松实现表单构建。

1.0.0 2018-03-26 13:48 UTC

This package is auto-updated.

Last update: 2024-09-18 21:34:52 UTC


README

一个简单的库,可以轻松实现表单构建。

Build Status

使用表单构建器

创建表单的过程很简单

  1. 实例化类
  2. 更改任何表单属性(如果需要的话)
  3. 添加输入,按照您想要看到的顺序
  4. 输出表单

让我们逐一介绍这些步骤

1) 实例化类

这很简单

use FormBuilder\Builder;

$builder = new FormBuilder\Builder();

这使用了表单的所有默认设置,如下所示

  • action: 空值,提交到当前URL
  • method: post
  • enctype: application/x-www-form-urlencoded
  • class: none
  • id: none
  • markup: html
  • novalidate: false
  • add_nonce: false
  • add_honeypot: true
  • form_element: true
  • add_submit: true

下面是每个设置的说明

您还可以通过传递一个URL来实例化,该URL将成为表单的动作

$builder = new FormBuilder\Builder('http://submit-here.com');

2) 更改任何表单属性(如果需要的话)

一旦创建表单,就使用set函数来更改默认属性

// Add a new form action
$builder->set('action', 'http://submit-here.com');

// Change the submit method
$builder->set('method', 'get');

// Change the enctype
$builder->set('enctype', 'multipart/form-data');

// Can be set to 'html' or 'xhtml'
$builder->set('markup', 'xhtml');

// Classes are added as an array
$builder->set('class', array());

// Add an id to the form
$builder->set('id', 'xhtml');

// Adds the HTML5 "novalidate" attribute
$builder->set('novalidate', true);

// Adds a WordPress nonce field using the string being passed
$builder->set('add_nonce', 'build_a_nonce_using_this');

// Adds a blank, hidden text field for spam control
$builder->set('add_honeypot', true);

// Wraps the inputs with a form element
$builder->set('form_element', true);

// If no submit type is added, add one automatically
$builder->set('form_element', true);

目前,有一些限制可以添加什么内容,但没有检查类或id是否有效,所以请注意这一点。

3) 添加输入,按照您想要看到的顺序

可以逐个添加输入或作为一组添加。无论哪种方式,它们的添加顺序就是显示顺序。

使用标签(以可读形式),设置数组和一个名称/ID缩写,如果需要的话,添加字段。

$builder->addInput('I am a little field', array(), 'little_field')
  • 参数1:一个可读的标签,它被解析并转换为名称和id,如果这些选项未明确设置。如果您在这里使用简单的标签“email”,请确保在参数3中设置一个更具体的名称。
  • 参数2:一个设置数组,它与默认设置合并,以控制字段的显示和类型。下面是默认和可能的设置。
  • 参数3:一个字符串,用于HTML属性的有效名称和id。这允许您设置与字段标签不同的特定提交名称。

字段输入的默认和可能设置(参数2)

type

  • 默认是"text"
  • 可以设置为任何内容,除非下面提到,否则用作输入字段的"type"。
  • 将此设置为"title"将使用标签文本输出h3元素
  • 将此设置为"textarea"将构建一个文本区域字段
  • 使用"select"与"options"参数的组合将创建一个下拉列表。

name

  • 默认是参数3,如果设置,或格式化的标签文本
  • 这成为字段的"name"属性

id

  • 默认是参数3,如果设置,或格式化的标签文本
  • 这成为字段的"id"属性和标签的"for"属性

label

  • 默认是参数1,可以显式使用此参数设置

value

  • 默认为空值
  • 如果找到具有相同名称的$_REQUEST索引,则用该值替换该值

placeholder

  • 默认为空值
  • HTML5属性,在字段聚焦时显示文本并消失

class

  • 默认为空数组
  • 使用有效的类名数组添加多个类

options

  • 默认为空数组
  • 选项数组用于类型为"select"、"checkbox"和"radio"的字段。对于其他输入,此参数被忽略
  • 数组应该是一个关联数组,值作为键,标签名称作为值,例如 array('value' => '显示的名称')
  • 字段的标签名称用作多选项的标题(将 "add_label" 设置为 "false" 以抑制)

最小值

  • 默认为空值
  • 用于 "range" 和 "number" 类型

最大值

  • 默认为空值
  • 用于 "range" 和 "number" 类型

步长

  • 默认为空值
  • 用于 "range" 和 "number" 类型

自动聚焦

  • 默认值为 "false"
  • "true" 值简单地添加 HTML5 的 "autofocus" 属性

选中

  • 默认值为 "false"
  • "true" 值简单地添加 "checked" 属性

必填

  • 默认值为 "false"
  • "true" 值简单地添加 HTML5 的 "required" 属性

添加标签

  • 默认值为 "true"
  • "false" 值将抑制此字段的标签

包装标签

  • 默认值为 "div"
  • 字段包装的有效 HTML 标签名。
  • 设置为空字符串以不使用字段包装

包装类

  • 默认值是一个包含 "form_field_wrap" 的数组
  • 类应该作为有效 HTML 类名的数组添加

包装 ID

  • 默认为空值
  • 通过传递一个字符串为该字段添加 ID

包装样式

  • 默认为空值
  • 此文本字符串将被添加到 style 属性中

4) 输出表单

一条简短的语句即可将表单输出为 HTML

$builder->buildForm();