Symfony twig 如何将类添加到表单行 [英] Symfony twig how to add class to a form row

问题描述

我正在使用 Twig 在 Symfony 2.3 中构建一个项目.我想向表单行块添加一个类.我正在使用包含以下内容的表单主题文件:

{% 块 form_row %}<div class="form-row">{{ form_label(form) }}{{ form_widget(form) }}{{ form_errors(form) }}

{% 结束块 %}

现在我的一些表单行我想添加一个额外的类form-row-split.我不知道如何正确地做到这一点.我几乎可以工作的方式是:

{% 块 form_row %}{% set attr = attr|merge({'class': 'form-row' ~ (attr.class 已定义 ? ' ' ~ attr.class : '') ~ (errors|length > 0 ? 'error' :'')} ) %}<div {{ block('widget_container_attributes') }}>{{ form_label(form) }}{{ form_widget(form) }}{{ form_errors(form) }}

{% 结束块 %}

(注意，我也将 error 类逻辑留在了那里，因为它需要保留).然后在表单构建器中:

$builder->add('first_name', 'text', array('属性' =>大批('类' =>'表格行拆分')));

这几乎有效，但它在任何地方都添加了这个类，并将小部件 ID 添加到行中！

<label for="myform_first_name">名字</label><input id="myform_first_name" class="form-row-split" type="text" name="myform[first_name]">

我能想到一些潜在的解决方案，但没有一个是漂亮或直接的.当然必须有一个简单的方法来做到这一点?

解决方案

其实这个问题有一个相当简单的解决方案.我只需要一个表单类型扩展来扩展基本表单类型以允许额外的可用选项:http://symfony.com/doc/2.3/cookbook/form/create_form_type_extension.html

按照文档中的示例，我创建了一个新的表单类型扩展:

//src/Acme/FrontendBundle/Form/Extension/FormTypeExtension.php命名空间 Acme\FrontendBundle\Form\Extension;使用 Symfony\Component\Form\AbstractTypeExtension;使用 Symfony\Component\Form\FormInterface；使用 Symfony\Component\Form\FormView；使用 Symfony\Component\OptionsResolver\OptionsResolverInterface；/*** 类 FormTypeExtension* @package Acme\FrontendBundle\Form\Extension*/类 FormTypeExtension 扩展 AbstractTypeExtension{/*** 扩展所有其他类型扩展的表单类型** @return string 被扩展类型的名称*/公共函数 getExtendedType(){返回表格"；}/*** 添加额外的 row_attr 选项** @param OptionsResolverInterface $resolver*/公共函数 setDefaultOptions(OptionsResolverInterface $resolver){$resolver->setDefaults(array('row_attr' =>大批()));}/*** 将设置的 row_attr 选项传递给视图** @param FormView $view* @param FormInterface $form* @param 数组 $options*/公共函数 buildView(FormView $view, FormInterface $form, array $options){$view->vars['row_attr'] = $options['row_attr'];}}

然后我在捆绑包中注册了该服务...

<service id="acme.form_type_extension" class="Acme\FrontendBundle\Form\Extension\FormTypeExtension"><tag name="form.type_extension" alias="form"/></服务>

由于每个小部件都扩展了基本表单类型，因此我可以在任何字段上传递这个新的 row_attr 选项，例如:

$builder->add('first_name', 'text', array('row_attr' =>大批('类' =>'表格行拆分')));

然后树枝覆盖以使用新的 row_attr 选项:

{% 块 form_row %}<div {{ block('form_row_attributes') }}>{{ form_label(form) }}{{ form_widget(form) }}{{ form_errors(form) }}

{% endblock form_row %}{% 块 form_row_attributes %}{% 无空间 %}{% for attrname, attrvalue in row_attr %}{{ attrname }}="{{ attrvalue }}" {% endfor %}{% endspaceless %}{% endblock form_row_attributes %}

大功告成！

(为了完整起见，我的完整树枝覆盖仍然在 form-row 和 error 类中合并，如下所示:

{% set row_attr = row_attr|merge({'class': 'form-row' ~ (row_attr.class 定义 ? ' ' ~ row_attr.class : '') ~ (errors|length >0 ? '错误' : '')} ) %}

.. 但这并不是回答我自己的问题所必需的 :P )

I am building a project in Symfony 2.3 using Twig. I want to add a class to the form row block. I am using a form theme file which contains:

{% block form_row %}
    <div class="form-row">
        {{ form_label(form) }}
        {{ form_widget(form) }}
        {{ form_errors(form) }}
    </div>
{% endblock %}

Now some of my form rows I want to add an extra class form-row-split. I can't figure out how to do this properly. The way I have it almost-working is:

{% block form_row %}
    {% set attr = attr|merge({'class': 'form-row' ~ (attr.class is defined ? ' ' ~ attr.class : '') ~ (errors|length > 0 ? ' error' : '')} ) %}
    <div {{ block('widget_container_attributes') }}>
        {{ form_label(form) }}
        {{ form_widget(form) }}
        {{ form_errors(form) }}
    </div>
{% endblock %}

(Note, I've left the error class logic in there too as that needs to stay). Then in the form builder:

$builder
        ->add('first_name', 'text', array(
            'attr' => array(
                'class' => 'form-row-split'
            )
        ));

This almost works but it adds this class everywhere and also adds the widget id to the row!

<div id="myform_first_name" class="form-row form-row-split">
    <label for="myform_first_name">First name</label>
    <input id="myform_first_name" class="form-row-split" type="text" name="myform[first_name]">
</div>

I can think of a few potential solutions but none of them are pretty or straight forward. Surely there must be a simple way of doing this?

解决方案

There is a fairly simple solution to this problem actually. I just needed a form type extension to extend the base form type to allow an extra available option: http://symfony.com/doc/2.3/cookbook/form/create_form_type_extension.html

Following through the example in the docs, I created a new form type extension:

// src/Acme/FrontendBundle/Form/Extension/FormTypeExtension.php

namespace Acme\FrontendBundle\Form\Extension;

use Symfony\Component\Form\AbstractTypeExtension;
use Symfony\Component\Form\FormInterface;
use Symfony\Component\Form\FormView;
use Symfony\Component\OptionsResolver\OptionsResolverInterface;

/**
 * Class FormTypeExtension
 * @package Acme\FrontendBundle\Form\Extension
 */
class FormTypeExtension extends AbstractTypeExtension
{
    /**
     * Extends the form type which all other types extend
     *
     * @return string The name of the type being extended
     */
    public function getExtendedType()
    {
        return 'form';
    }

    /**
     * Add the extra row_attr option
     *
     * @param OptionsResolverInterface $resolver
     */
    public function setDefaultOptions(OptionsResolverInterface $resolver)
    {
        $resolver->setDefaults(array(
            'row_attr' => array()
        ));
    }

    /**
     * Pass the set row_attr options to the view
     *
     * @param FormView $view
     * @param FormInterface $form
     * @param array $options
     */
    public function buildView(FormView $view, FormInterface $form, array $options)
    {
        $view->vars['row_attr'] = $options['row_attr'];
    }
}

Then I registered the service in my bundle...

<!-- Form row attributes form extension -->
<service id="acme.form_type_extension" class="Acme\FrontendBundle\Form\Extension\FormTypeExtension">
    <tag name="form.type_extension" alias="form" />
</service>

Since every widget extends the base form type this then allows me to pass this new row_attr option through on any field, eg:

$builder
    ->add('first_name', 'text', array(
        'row_attr' => array(
            'class' => 'form-row-split'
        )
    ));

Then the twig overrides to make use of the new row_attr option:

{% block form_row %}
    <div {{ block('form_row_attributes') }}>
        {{ form_label(form) }}
        {{ form_widget(form) }}
        {{ form_errors(form) }}
    </div>
{% endblock form_row %}

{% block form_row_attributes %}
    {% spaceless %}
        {% for attrname, attrvalue in row_attr %}{{ attrname }}="{{ attrvalue }}" {% endfor %}
    {% endspaceless %}
{% endblock form_row_attributes %}

And it's done!

(For completeness, my full twig override still merges in the form-row and error classes in like so:

{% set row_attr = row_attr|merge({'class': 'form-row' ~ (row_attr.class is defined ? ' ' ~ row_attr.class : '') ~ (errors|length > 0 ? ' error' : '')} ) %}

.. but thats not really necessary for answering my own question :P )

这篇关于Symfony twig 如何将类添加到表单行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！