Question

我在Symfony2中有一个表单集合。我需要使用一些特定的div结构来设置这些表单的样式，如下所示：

<div class="block" style="clear: both;">
  {{ form_row(form.name) }}
  {{ form_row(form.address) }}
</div>
<div class="block">
  {{ form_row(form.website) }}
  {{ form_row(form.email) }}
</div>
<div>
 <div>
   {{ form_row(form.text1) }}
 </div>
</div>

正如您所看到的，结构不规则，我不知道如何在{％block collection_widget％}的{％for rows in rows％}循环中设置样式。任何想法我如何样式/构建表单原型所以添加javascript的表单看起来会像我想要的那样精确？

Answer 1

我发现最好的方法是为表单创建单独的twig模板，然后将表单/原型传递给那样的..

_form.html.twig

<div class="block" style="clear: both;">
    {{ form_row(form.name) }}
    {{ form_row(form.address) }}
</div>
<div class="block">
    {{ form_row(form.website) }}
    {{ form_row(form.email) }}
</div>
<div>
    <div>
        {{ form_row(form.text1) }}
    </div>
</div>

update.html.twig

<ul data-prototype="{{ include('_form.html.twig', 
                                {'form': form.items.vars.prototype })|e }}">
    {% for item in form.items %}
        <li>{{ include('_form.html.twig', {'form': item }) }}</li>
    {% endfor %}
</ul>

这将允许您将表单项原型传递到您用于实际表单项的相同模板中，这意味着您只需在事情发生变化时更新一个模板。

Answer 2

你可以在twig中使用一个简单的for循环，而不扩展{％block collection_widget％}：

{% for counter in form.MyCollection %}
<div class="block" style="clear: both;">
  {{ form_row(form.MyCollection[loop.index0].name) }}
  {{ form_row(form.MyCollection[loop.index0].address) }}
</div>
<div class="block">
  {{ form_row(form.MyCollection[loop.index0].website) }}
  {{ form_row(form.MyCollection[loop.index0].email) }}
</div>
<div>
 <div>
   {{ form_row(form.MyCollection[loop.index0].text1) }}
 </div>
</div>
{% endfor %}

如何设置Symfony2表单样式的样式

2 个答案: