来自样式时间小部件的 Symfony

Question

我目前正在尝试设置由 symfony 表单生成器生成的表单的样式。

它上面有一个 bootstrap 叠加层，但我想移动时间小部件，以便它们彼此对齐。

Answer 1

您可以使用

独立显示表单的每个输入

form_row(form.yourinputname)

form_row 是字段标签、错误和小部件的组合。

你可以看到doc关于这个

编辑：

所以如果你想在一行中显示一些小部件，你可以这样做（你必须使用循环来显示表单集合的每个输入）：

<style type="text/css">
    .myClass{
       .inline{
         display: inline-block;
       }
    }
</style>

<div class='myClass'>
  {% for business in form.businesshours %}
      <div class="inline">{{ form_row(business.day) }}</div>
      <div class="inline">{{ form_row(business.openTime) }}</div>
      <div class="inline">{{ form_row(business.breakStart) }}</div>
      <div class="inline">{{ form_row(business.breakEnd) }}</div>
      <div class="inline">{{ form_row(business.closeTime) }}</div>
  {% endfor %}
</div>

Answer 2

添加 HTML 以移动每个表单行。（与@DOZ 的答案相同，但 bootstrap 类）。

删除 {{ form_row(form.businessHours) }} 和 :

<div class="row">
    <div class="col-xs-3">
        {{ form_row(form.businessHours.Begin) }}
    </div>    
    <div class="col-xs-3">
        {{ form_row(form.businessHours.BeginPauze) }}
    </div>    
    <div class="col-xs-3">
        {{ form_row(form.businessHours.EindPauze) }}
    </div>    
    <div class="col-xs-3">
        {{ form_row(form.businessHours.Einde) }}
    </div>    
</div>

Answer 3

http://symfony.com/doc/current/form/form_customization.html#how-to-customize-an-individual-field

在本节中，有一个部分可以覆盖单行的显示，如果您尝试类似的操作并给 div 一个您自己的 class，您可能能够使用 css 设置样式。

这似乎是用于表单样式和自定义的页面。

希望对您有所帮助

{% form_theme form _self %}
{% block _datetime_row %} 
<div class="your_class"> 
{{ form_label(form) }} 
{{ form_errors(form) }} 
{{ form_widget(form) }} 
</div> 
{% endblock %}

{{ form_row(form.name) }}

来自样式时间小部件的 Symfony

Symfony from styling time widgets

css

styling

formbuilder

symfony

twig