使用{{form_label()}}在表单前面的文本列

时间:2017-09-27 13:58:59

标签: css symfony

我正在尝试重用这些旧代码来制作一些表单:

在form.html.twig

<div class="row" style='margin-bottom: 5px'>
        <div style='white-space:nowrap'>
          <div class='col-xs-2'></div>
          <div class='col-xs-3' style='border-bottom:1px solid black;padding-bottom: 14px'><div style='float:right'>{{ form_label(form.class.variable, 'Text on one column and text on another column', {'label_attr':{'style':'margin-top:5px'}})}}</div>
          <div class='col-xs-3' style='border-bottom:1px solid black;padding-bottom: 5px'>{{ form_widget(form.class.variable, {'attr':{'style':'width:95px','placeholder':'RAW value'}})}}</div>
          <div class='col-xs-3'></div>
        </div>  

我想在表单之前有两列,如下图所示: two columns

谢谢您的提示!

1 个答案:

答案 0 :(得分:1)

您需要自定义form_label阻止。

查看示例here

编辑:

粗略地说,你是这样的:

您的表单主题(例如,two_column_labels.html.twig):

{% extends 'form_div_layout.html.twig' %}

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

{% block form_label %}
    {% if label_attr.extra_label is defined %}
        <div class="row">
            <div class="col-sm-6">
                {% set orig_label = label %}
                {% set new_label_attr = [] %}
                {% for key,value in label_attr %}
                    {% if key != 'extra_label' %}
                        {% set new_label_attr = new_label_attr|merge({(key): value}) %}
                    {% else %}
                        {% set label = value %}
                    {% endif %}
                {% endfor %}
                {% set label_attr = new_label_attr %}
                {{ parent() }}
                {% set label = orig_label %}
            </div>
            <div class="col-sm-6">
                {{ parent() }}
            </div>
        </div>
    {% else %}
        {{ parent() }}
    {% endif %}
{% endblock form_label %}

在表单类的表单字段定义中:

  'label' => 'Second Label',
  'label_attr' => array('extra_label' => 'First Label'),

在表单模板中:

{% form_theme form 'two_column_labels.html.twig' %}