表单元素

表单元素

在上一节中，在表单类的 Form::buildForm() 方法中使用了一种可以接受用户输入的渲染元素， 它们用于构建表单渲染数组，因此称为 表单元素(FormElement)。

在这一节，我们学习如何创建自定义 表单元素(FormElement)， 同时，深入了解它与普通 渲染元素(RenderElement) 的关系。

创建表单元素

我们先直接通过代码演示一个简单的例子，再对这个例子进行讲解。

在这个例子中，我们定义一个表单元素，接受手机号码输入， 元素自已会对输入的手机号码进行格式检查，如果不符合要求，通知表单显示验证错误。

编写代码

添加表单元素类 scr/Element/Phone.php：

<?php
namespace Drupal\example0404\Element;

use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Render\Element;
use Drupal\Core\Render\Element\FormElement;

/**
 * @FormElement("phone")
 */
class Phone extends FormElement {

  public function getInfo() {
    $class = get_class($this);
    return [
      '#input' => true,
      '#process' => [
        [$class, 'processElement'],
      ],
      '#pre_render' => [
        [$class, 'preRenderElement'],
      ],
      '#element_validate' => [
        [$class, 'validateElement'],
      ],
      '#theme_wrappers' => ['form_element'],
      '#title_display' => 'before'
    ];
  }

  public static function processElement(array $element, FormStateInterface $form_state, array &$complete_form) {
    $element['#theme'] = 'phone';
    return $element;
  }

  public static function preRenderElement($element) {
    $element['#attributes']['type'] = 'text';
    Element::setAttributes($element, ['id', 'name']);
    static::setAttributes($element, ['form-text']);
    return $element;
  }

  public static function validateElement(array $element, FormStateInterface $form_state) {
    if(!preg_match("/^1[34578]\d{9}$/", $element['#value'])){
      $form_state->setError($element, '手机号格式不正确');
    }
  }
}

在 example0404.module 文件中注册 phone 模板：