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 Helper

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

使用ZenstruckFormHelper.initSelect2Helper()启用

TunnelEntityType

创建一个带有选择按钮的实体关联字段。可以定义选择按钮的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：清除标题/ID的按钮（如果required为false则可用）
.zenstruck-tunnel-select：启动实体选择的按钮

FormType选项

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

隧道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>标签成为方法="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表单集合'添加'和'删除'按钮功能。请参阅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

philkingston / form-bundle

维护者

详细信息

README

安装

Twitter Bootstrap表单布局

FormType扩展

AjaxEntityType

FormType选项

Select2 Javascript Helper

TunnelEntityType

FormType选项

隧道JavaScript助手

帮助类型

分组类型

向`GroupedFormView`添加自定义数据

自定义分组顺序

主题类型

其他JavaScript助手

PostLinkHelper

FormCollectionHelper

完整默认配置

philkingston / form-bundle

维护者

详细信息

README

安装

Twitter Bootstrap表单布局

FormType扩展

AjaxEntityType

FormType选项

Select2 Javascript Helper

TunnelEntityType

FormType选项

隧道JavaScript助手

帮助类型

分组类型

向GroupedFormView添加自定义数据

自定义分组顺序

主题类型

其他JavaScript助手

PostLinkHelper

FormCollectionHelper

完整默认配置

向`GroupedFormView`添加自定义数据