Form theming and Symfony Collections

2019-09-15 11:57发布

站内文章 / 移动开发
22 0 0

问题:

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.

回答1:

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 symfony-forms
举报

收藏的人(0)

Ta的文章 更多文章
登录 后发表评论
0条评论
还没有人评论过~