README

提供 Twitter Bootstrap 表单主题、有用的 FormType 扩展和 JavaScript 辅助工具。

安装

将其添加到您的 composer.json

composer require zenstruck/form-bundle:~1.4

可选如果使用 ajax_entity_controller 功能，请将 zendframework/zend-crypt 添加到您的 composer.json
```
composer require zendframework/zend-crypt:~2.0,!=2.1.1
```
注意： zend-crypt 的 2.1.1 版本没有正确配置其自动加载器。
可选如果使用分组表单功能，请将 cocur/slugify 添加到您的 composer.json
```
composer require cocur/slugify:~0.8
```

在 Symfony2 中注册该包

// app/AppKernel.php

public function registerBundles()
{
    $bundles = array(
        // ...
        new Zenstruck\Bundle\FormBundle\ZenstruckFormBundle(),

        // enable if you want to use the grouped form
        // new Cocur\Slugify\Bridge\Symfony\CocurSlugifyBundle()
    );
    // ...
}

如果使用 'Select2'，请确保从 http://ivaynberg.github.io/select2/ 下载所需的文件，并将文件包含在您的模板中。

//base.html.twig Example

//...
{% block stylesheets %}
    <link href="{{ asset('path/to/select2.css') }}" type="text/css" rel="stylesheet" />

//...
{% block javascripts %}
    <script type="text/javascript" src="{{ asset('path/to/select2.js') }}"></script>
    <script type="text/javascript" src="{{ asset('path/to/zenstruckform/js/helper.js') }}"></script>
    <script type="text/javascript" src="{{ asset('path/to/zenstruckform/js/script.js') }}"></script>

Twitter Bootstrap 表单布局

使用方法如下：

为单个模板添加

{# for bootstrap 2.x #}
{% form_theme form 'ZenstruckFormBundle:Twitter:form_bootstrap_layout.html.twig' %}

{# for bootstrap 3.x #}
{% form_theme form 'ZenstruckFormBundle:Twitter:form_bootstrap3_layout.html.twig' %}

在您的 config.yml 中全局添加

twig:
    form:
        resources:
            # for bootstrap 2.x
            - 'ZenstruckFormBundle:Twitter:form_bootstrap_layout.html.twig'

            # for bootstrap 3.x
            - 'ZenstruckFormBundle:Twitter:form_bootstrap3_layout.html.twig'

FormType 扩展

AjaxEntityType

创建一个 1-m 或 m-m 实体关联字段。此类型简单地创建一个隐藏字段，该字段接受一个或多个以逗号分隔的实体 ID。 注意： 确保实体已定义 __toString()。

在您的 config.yml 中启用（默认禁用）

zenstruck_form:
    form_types:
        ajax_entity: true

有几种方法可以使用此类型

默认 - 创建一个隐藏字段类型。添加功能由用户决定。

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;

class MyFormType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('name', 'zenstruck_ajax_entity', array(
                'class' => 'AppBundle:MyEntity' // ensure MyEntity::__toString() is defined
            ))
        ;
    }

    // ...
}

Select2 与内置实体查找器（需要 zendframework/zend-crypt）

在您的 config.yml 中启用控制器（默认禁用）

zenstruck_form:
    form_types:
        ajax_entity_controller: true

将路由添加到您的 routing.yml

zenstruck_form:
    resource: "@ZenstruckFormBundle/Resources/config/ajax_entity_routing.xml"

将路由添加到您的表单类型

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;

class MyFormType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('name', 'zenstruck_ajax_entity', array(
                'class'             => 'AppBundle:MyEntity', // ensure MyEntity::__toString() is defined
                'use_controller'    => true,
                'property'          => 'name', // the entity property to search by
                // 'repo_method'    => 'findActive' // for using a custom repository method
                // 'extra_data'     => array() // for adding extra data in the ajax request (only applicable when using repo_method)
            ))
        ;
    }

    // ...
}

注意： URL 为每个实体动态生成，但出于安全目的，使用应用程序的 secret 进行加密。

Select2 与自定义 URL。这将为此字段创建一个 Select2 小部件。

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;

class MyFormType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('name', 'zenstruck_ajax_entity', array(
                'class' => 'AppBundle:MyEntity', // ensure MyEntity::__toString() is defined
                'url' => '/myentity/find'
            ))
        ;
    }

    // ...
}

URL 端点接收搜索字符串作为 q 请求参数，必须返回一个 JSON 编码的数组。以下是一个示例

[
    {"id":2004,"text":"dolorem"},
    {"id":2008,"text":"inventore"}
]

FormType 选项

class: 字段表示的实体。 必需。
url: Select2 将发送搜索查询的 URL
property: 要搜索的实体属性（覆盖 url）
method: 用于搜索的自定义存储库方法（覆盖 property）
placeholder: Select2 占位符文本。默认：选择一个选项
multiple: 是否允许多个值。默认：false
use_controller：是否使用捆绑的控制器（）。默认：false
repo_method：用于使用自定义存储库方法。默认：null
extra_data：用于在ajax请求中添加额外数据（仅适用于使用repo_method）。默认 array()

Select2 JavaScript助手

为AjaxEntityType启用Select2小部件。需要Select2。

使用ZenstruckFormHelper.initSelect2Helper()启用

隧道实体类型

创建一个带有选择按钮的实体关联字段。可以为选择按钮定义JavaScript回调。可用于打开对话框以选择实体。

在您的 config.yml 中启用（默认禁用）

zenstruck_form:
    form_types:
        tunnel_entity: true

为您的表单字段添加帮助选项

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;

class MyFormType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('name', 'zenstruck_tunnel_entity', array(
                'class' => 'AppBundle:MyEntity',
                'callback' => 'MyApp.selectMyEntity',
                'required' => false
            ))
        ;
    }

    // ...
}

上述示例生成的小部件HTML如下

<div class="input-append zenstruck-tunnel-widget">
    <input type="hidden" class="zenstruck-tunnel-id" />
    <span class="uneditable-input zenstruck-tunnel-title">{{ title }}</span>
    <a href="#" class="btn zenstruck-tunnel-clear"><b class="icon-remove"></b></a>
    <a href="#" class="btn zenstruck-tunnel-select" data-callback="MyApp.selectMyEntity">Select...</a>
</div>

您的JavaScript可以连接到清除按钮和选择按钮。以下是有用的类

.zenstruck-tunnel-id：所选实体的id
.zenstruck-tunnel-title：所选实体的标题
.zenstruck-tunnel-clear：清除标题/ids的按钮（仅在required为false时可用）
.zenstruck-tunnel-select：启动实体选择的按钮

表单类型选项

class: 字段表示的实体。 必需。
callback：JavaScript回调
button_text：选择按钮的文本。默认：Select...

隧道JavaScript助手

向清除和选择按钮添加事件。选择按钮调用类型选项中定义的callback。回调接收以下参数

id：当前所选实体的id（如果有）
element：隐藏的输入元素

使用ZenstruckFormHelper.initTunnelHelper()启用

帮助类型

允许您向表单字段添加帮助消息。

在您的 config.yml 中启用（默认禁用）

zenstruck_form:
    form_types:
        help: true

为您的表单字段添加帮助选项

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;

class MyFormType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('name', 'text', array(
                'help' => 'Your full name'
            ))
        ;
    }

    // ...
}

分组类型

此类型允许您将大型表单分组到选项卡中。

在您的 config.yml 中启用（默认禁用）

zenstruck_form:
    form_types:
        group: true

为您的表单字段添加帮助选项

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;

class MyFormType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('name', 'text', array(
                'group' => 'Foo'
            ))
            ->add('name', 'text', array(
                'group' => 'Bar'
            ))
        ;
    }

    // ...
}

注意：没有分组的字段将位于第一个默认选项卡中。

在控制器中创建您的表单视图时，用Zenstruck\Bundle\FormBundle\Form\GroupedFormView包裹它

class MyController extends Controller
{
    public function newAction(Request $request)
    {
        // ...
        return array(
            'grouped_form' => new \Zenstruck\Bundle\FormBundle\Form\GroupedFormView($form->createView())
        );
    }
}

注意：要将默认选项卡的名称更改为除“默认”以外的名称，请将其作为GroupedFormView构造函数的第二个参数传递。

在您的模板中，包含grouped_form.html.twig以渲染表单。

<form method="post" {{ form_enctype(grouped_form.form) }}>
    {% include 'ZenstruckFormBundle:Twitter:grouped_form.html.twig' with { 'grouped_form': grouped_form } %}
</form>

注意：要使用包裹的表单，请使用grouped_form.form

将自定义数据添加到`GroupedFormView`

// ..
$groupedForm = new \Zenstruck\Bundle\FormBundle\Form\GroupedFormView($form->createView());
$groupedForm->setData('foo', 'bar');

在您的模板中

{# ... #}
{{ grouped_form.data('foo') }} {# returns bar #}

自定义分组顺序

$groupedForm = new GroupedFormView($form->createView(), 'Default', array(
    'Bar', 'Foo', 'Default'
));

主题类型

允许您向表单字段添加主题选项。变量theme_options将在您的表单主题中可用。当前bootstrap3主题使用。

在您的 config.yml 中启用（默认禁用）

zenstruck_form:
    form_types:
        theme: true

在您的config.yml中设置默认主题选项

zenstruck_form:
    theme_options:
        control_width: col-md-4
        label_width: col-md-2
        # ...

在您的表单中设置字段的主题选项

use Symfony\Component\Form\AbstractType;
use Symfony\Component\Form\FormBuilderInterface;

class MyFormType extends AbstractType
{
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder
            ->add('name', 'text', array(
                'theme_options' => array('control_width' => 'col-md-6')
            ))
        ;
    }

    // ...
}

杂项JavaScript助手

此包包含一组有用的JavaScript助手。要启用，请添加以下JavaScript文件（或将它添加到您的assetic JavaScripts中）。

<script type="text/javascript" src="{{ asset('bundles/zenstruckform/js/helper.js') }}"></script>

使用以下方式初始化所有助手：

$(function() {
    ZenstruckFormHelper.initialize();
});

PostLinkHelper

允许一个标准的<a>标签成为一个method="POST"链接。将类method-post、method-post-confirm或method-delete添加到<a>标签中，使其href值成为POST链接。

method-post：标准的POST链接（无确认）
method-post-confirm：带有自定义data-message属性的自定义确认对话框的method-post
method-delete：具有“您确定要删除吗？”确认对话框的跨浏览器兼容的DELETE链接

使用ZenstruckFormHelper.initPostLinkHelper()启用

FormCollectionHelper

添加Symfony2表单集合的'add'和'delete'按钮功能。参见Symfony2文档。当使用此包提供的form_bootstrap_layout.html.twig表单布局时，它将直接工作。

注意：请不要添加Symfony2食谱文章中提供的JavaScript。

使用ZenstruckFormHelper.initFormCollectionHelper()启用

完整默认配置

zenstruck_form:
    form_types:
        help:                   false
        group:                  false
        tunnel_entity:          false
        ajax_entity:            false
        ajax_entity_controller: false

zenstruck / form-bundle

维护者

详细信息

README

安装

Twitter Bootstrap 表单布局

FormType 扩展

AjaxEntityType

FormType 选项

Select2 JavaScript助手

隧道实体类型

表单类型选项

隧道JavaScript助手

帮助类型

分组类型

将自定义数据添加到`GroupedFormView`

自定义分组顺序

主题类型

杂项JavaScript助手

PostLinkHelper

FormCollectionHelper

完整默认配置

zenstruck / form-bundle

维护者

详细信息

README

安装

Twitter Bootstrap 表单布局

FormType 扩展

AjaxEntityType

FormType 选项

Select2 JavaScript助手

隧道实体类型

表单类型选项

隧道JavaScript助手

帮助类型

分组类型

将自定义数据添加到GroupedFormView

自定义分组顺序

主题类型

杂项JavaScript助手

PostLinkHelper

FormCollectionHelper

完整默认配置

将自定义数据添加到`GroupedFormView`