表单主题和 Symfony 集合 [英] Form theming and Symfony Collections

查看：33
本文介绍了表单主题和 Symfony 集合的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想在 Twig 中为我的 CollectionType 添加特定样式，我在这里收到了一个解决方案:

所以 DestinationId 标签在 <div class="col-lg-4... 内，小部件也在 < 内.div class=col-lg-4... 然后在小部件内我在 <div class="col-lg-4 ...

我想通过专门为此部分添加一个新的自定义 form_rom 来解决这个问题，所以我在 profiler->forms->my form->vars->unique_block_prefix 中找到了块的名称= _AddChildStep3_childsFamily 并尝试了这个:

{% block _AddChildStep3_childsFamily_entry_row %}<div class="row"><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.relRole, "", {'label_attr': {'class': 'pull-right'}}) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.relRole) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.relRole) -}}

<br/><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.destinationId.firstName, "", {'label_attr': {'class': 'pull-right'}}) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.destinationId.firstName) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.destinationId.firstName) -}}

<br/><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.destinationId.lastName, "", {'label_attr': {'class': 'pull-right'}}) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.destinationId.lastName) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.destinationId.lastName) -}}

<br/><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.destinationId.bornOn, "", {'label_attr': {'class': 'pull-right'}}) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.destinationId.bornOn) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.destinationId.bornOn) -}}

<br/><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.destinationId.profession, "", {'label_attr': {'class': 'pull-right'}}) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.destinationId.profession) -}}

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.destinationId.profession) -}}

<br/>

{% 结束块 %}

正如文档中所写的那样(http://symfony.com/doc/current/form/form_customization.html#how-to-customize-a-collection-prototype) 但这不起作用...

ps:在这种情况下，我的 HTML 是 

 
<div id="familyMembersList" data-prototype="{{ form_widget(form.childsFamily.vars.prototype)|e('html_attr') }}">

当我去探查器/树枝时，我没有看到树枝使用我的自定义条目行......也许自定义块的名称是错误的?我在 stackoverflow 上的答案中找到了必须自定义的块的名称.

解决方案

好的，经过一些头疼和几次尝试后，我发现 Symfony/Form/twig 不想自定义条目行.我试过这个:

 {% block _AddChildStep3_childsFamily_entry_widget %}<div class="row"><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.relRole, "", {'label_attr': {'class': 'pull-right'}}) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.relRole) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.relRole) -}}
<br/><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.destinationId.firstName, "", {'label_attr': {'class': 'pull-right'}}) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.destinationId.firstName) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.destinationId.firstName) -}}
<br/><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.destinationId.lastName, "", {'label_attr': {'class': 'pull-right'}}) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.destinationId.lastName) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.destinationId.lastName) -}}
<br/><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.destinationId.bornOn, "", {'label_attr': {'class': 'pull-right'}}) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.destinationId.bornOn) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.destinationId.bornOn) -}}
<br/><div class="form-group{% if (not Compound or force_error|default(false)) and not valid %} has-error{% endif %}"><div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_label(form.destinationId.profession, "", {'label_attr': {'class': 'pull-right'}}) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_widget(form.destinationId.profession) -}}
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">{{- form_errors(form.destinationId.profession) -}}
<br/>
<br/>{% 结束块 %}

即使它并不完美，这也能奏效.希望它可以帮助:)

I wanted to add particular style to my CollectionType in twig and I received a solution here : Symfony/Jquery Collection of objects. Now I have a little problem that I can't solve :

I have this custom form_row : 

// src/MyBundle/Ressources/views/CustomForms    
{% block form_row %}
        <div class="row">
            <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                    {{- form_label(form, "", {'label_attr': {'class': 'pull-right'}}) -}}
                </div>

                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                    {{- form_widget(form) -}}
                </div>

                <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                    {{- form_errors(form) -}}
                </div>
            </div>
        </div>

        <br/>
    {% endblock %}

That works perfectly in one case but now I have a FormFlow (CraueFormFlow) and one of my multi-steps form is :

class AddChildStep3 extends AbstractType {
    public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder->add('childsFamily', CollectionType::class, array(
            'entry_type' => RelationshipType::class,
            'allow_add' => true
        ));
    }

    public function getBlockPrefix()
    {
        return 'AddChildStep3';
    }

That renders a collection of this form :

/**
 * {@inheritdoc}
 */
public function buildForm(FormBuilderInterface $builder, array $options)
{
    $builder
        ->add('relRole', EntityType::class, array(
            'class' => 'VSCrmBundle:RelRole'
        ))
        //->add('sourceId', PersonChildType::class)
        ->add('destinationId', PersonRelationshipType::class);
}

/**
 * {@inheritdoc}
 */
public function configureOptions(OptionsResolver $resolver)
{
    $resolver->setDefaults(array(
        'data_class' => 'VS\CrmBundle\Entity\Relationship'
    ));
}

/**
 * {@inheritdoc}
 */
public function getBlockPrefix()
{
    return 'vs_crmbundle_relationship';
}

and the problem is that the form_row that I've defined before wors well for relRole of the last form but the destinationId property is showing this :

So the DestinationId label is inside the <div class="col-lg-4... and the widget is also inside a <div class=col-lg-4... and then inside the widget I have one more time label inside a <div class="col-lg-4 ...

I wanted to solve this by adding a new custom form_rom specially for this part so I've found the name of the block in profiler->forms->my form->vars->unique_block_prefix = _AddChildStep3_childsFamily and tried this :

{% block _AddChildStep3_childsFamily_entry_row %}
    <div class="row">
        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.relRole, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.relRole) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.relRole) -}}
            </div>
        </div>

        <br/>

        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.destinationId.firstName, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.destinationId.firstName) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.destinationId.firstName) -}}
            </div>
        </div>

        <br/>

        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.destinationId.lastName, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.destinationId.lastName) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.destinationId.lastName) -}}
            </div>
        </div>

        <br/>

        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.destinationId.bornOn, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.destinationId.bornOn) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.destinationId.bornOn) -}}
            </div>
        </div>

        <br/>

        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.destinationId.profession, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.destinationId.profession) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.destinationId.profession) -}}
            </div>
        </div>

        <br/>
    </div>
{% endblock %}

As it's written in the docs (http://symfony.com/doc/current/form/form_customization.html#how-to-customize-a-collection-prototype) but this doesn't work...

ps: for info my HTML in this case is 

    <div class="row">
        <div id="familyMembersList" data-prototype="{{ form_widget(form.childsFamily.vars.prototype)|e('html_attr') }}">
        </div>
    </div>

EDIT: When I go to profiler/twig I don't see that Twig use my custom entry row ... Maybe the name of the custom block is wrong ? I've found the name of the block that I have to customize in an answer on stackoverflow.

解决方案

Ok, After some head pain and several tries I've found that Symfony/Form/twig doesn't wants to customize the entry row. I've tried this :

    {% block _AddChildStep3_childsFamily_entry_widget %}
    <div class="row">
        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.relRole, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.relRole) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.relRole) -}}
            </div>
        </div>

        <br/>

        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.destinationId.firstName, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.destinationId.firstName) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.destinationId.firstName) -}}
            </div>
        </div>

        <br/>

        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.destinationId.lastName, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.destinationId.lastName) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.destinationId.lastName) -}}
            </div>
        </div>

        <br/>

        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.destinationId.bornOn, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.destinationId.bornOn) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.destinationId.bornOn) -}}
            </div>
        </div>

        <br/>

        <div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_label(form.destinationId.profession, "", {'label_attr': {'class': 'pull-right'}}) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_widget(form.destinationId.profession) -}}
            </div>

            <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12">
                {{- form_errors(form.destinationId.profession) -}}
            </div>
        </div>

        <br/>
    </div>

    <br/>
{% endblock %}

And this works even is it's not perfect. Hope it can help :)

这篇关于表单主题和 Symfony 集合的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆