我在理解Symfony 2中的表单组件时遇到问题,首先我想用一些bootstrap类自定义我的表单,但问题是我不知道怎么做,因为在twig模板中只有#s; s这些行
{% extends 'Bundle::layout.html.twig' %}
{% block content -%}
<div class="panel-heading"> <h3>Category</h3></div>
<div class="panel-body">
{{ form(edit_form) }}
<ul class="record_actions">
<li>
<a href="{{ path('category') }}">
Back to the list
</a>
</li>
<li>{{ form(delete_form) }}</li>
</ul>
</div>
{% endblock %}
例如,我想使用bootstrap
将表单更改为类似的内容<div class="container">
<div class="panel panel-default">
<div class="panel-heading">Category </div>
<div class="panel-body">
<form class="form-horizontal">
<div class="form-group">
<label for="Name" class="control-label col-xs-2"> CategoryName</label>
<div class="col-xs-6">
<input type="text" class="form-control" required="" id="Name" placeholder="Category name" >
</div>
</div>
<div class="form-group">
<div class="col-xs-offset-2 col-xs-10">
<button type="submit" class="btn btn-primary">Edit</button>
</div>
</div>
</form>
答案 0 :(得分:4)
我相信您所寻找的内容可以在Rendering each field manually的Symfony文档中找到。因此,您希望为您的表单执行以下操作:
<div class="panel-body">
{{ form_start(edit_form }}
<div class="form-group">
{{ form_label(edit_form.categoryName, 'CategoryName', {'label_attr': {'class': 'control-label col-xs-2'}}) }}
<div class="col-xs-6">
{{ form_widget(edit_form.categoryName, {'attr': {'class': 'form-control'}}) }}
</div>
</div>
<div class="form-group">
<div class="col-xs-offset-2 col-xs-10">
<button type="submit" class="btn btn-primary">Edit</button>
</div>
</div>
{{ form_end(form) }}
</div>
或者沿着这些方向的东西。如您所见,您可以向树枝渲染表单添加类。有关树枝模板功能的完整参考,请参阅文档Twig Reference
如果你也用树枝渲染按钮,那么你可以这样做:
<div class="form-group">
<div class="col-xs-offset-2 col-xs-10">
{{ form_widget(form.editButton, {'attr': {'class': 'btn btn-primary'}}) }}
</div>
</div>