【发布时间】：2015-10-02 08:53:20
【问题描述】：
我正在尝试摆脱 symfony2 表单中 Twig 中的重复布局 目前我的布局看起来像：
<form name="step2" method="post" action="" class="productForm">
<h2>Step2:</h2>
<div id="step2">
<div class="form-group">
<div class="form-widget">
<div id="step2_client1">
<div class="form-group"><label class="control-label required" for="step2_client1_clientTitle">Client 1 title:</label>
<div class="form-widget"><select id="step2_client1_clientTitle" name="step2[client1][clientTitle]" class="form-control">
<option value="Mr">Mr</option>
<option value="Mrs">Mrs</option>
<option value="Miss">Miss</option>
<option value="Ms">Ms</option>
<option value="Dr">Dr</option>
<option value="Sir">Sir</option>
</select></div>
</div>
<div class="form-group"><label class="control-label required" for="step2_client1_firstName">Client 1 first name:</label>
<div class="form-widget"><input type="text" id="step2_client1_firstName" name="step2[client1][firstName]" required="required" class="form-control">
</div>
</div>
<div class="form-group"><label class="control-label required" for="step2_client1_surname">Client 1 last name:</label>
<div class="form-widget"><input type="text" id="step2_client1_surname" name="step2[client1][surname]" required="required" class="form-control"></div>
</div>
</div>
</div>
</div>
...
<div class="form-group form-group-submit">
<div class=""><a id="step2_save" class="has-spinner btn btn-default btn-submit"><span class="spinner"><i class="fa fa-spinner fa-spin"></i></span>Complete the quote
</a></div>
</div>
<input type="hidden" id="step2__token" name="step2[_token]" class="form-control" value="xxx"></div>
</form>
而且我有一个肮脏的 js 脚本，可以按照我希望它显示的方式修复我的布局，但正如我所说，这很脏。所以我想知道是否有人可以帮助我更改我的 twig 文件以仅显示子元素而不是父元素的表单组和表单小部件 css 类。
肮脏的js脚本：
$('.form-group').each(function(e){
if($(this).parents('.form-group').length) {
var $realGroup = $(this).parents('.form-group');
$realGroup.toggleClass('form-group');
$realGroup.children('.form-widget').toggleClass('form-widget');
}
});
还有小树枝：
{% block form_row -%}
{% spaceless %}
<div class="form-group{% if (not compound or force_error|default(false)) and not valid %} has-error{% endif %}">
{{ form_label(form) }}
<div class="form-widget">
{{ form_widget(form) }}
{{ form_errors(form) }}
</div>
</div>
{% endspaceless %}
{%- endblock form_row %}
现在树枝位是标准的 SF2 引导表单布局，我很确定我没有改变它。
所以任何帮助摆脱 js 脚本并实际在 twig 中执行它都会很棒，我尝试了一些东西，但每一个都比我用 js 做的更糟糕，所以我有点卡住了。
编辑：
js 脚本所做的只是删除 css 类，因此布局有效。它看起来很平坦，因为它只是空的 div，但我所追求的并不是首先显示 div。我正在尝试更改 twig 脚本，而不是 css，因为这正是我们想要的方式。
【问题讨论】：
-
您是否只是想使用 CSS 定位表单的特定部分？因为如果是这样，那么使用child selectors 肯定会更容易？
-
我重读了 3 次，我不知道你在说什么（与他的例子有关）我不想用 css 来定位任何东西，我只是想要任何嵌套的表单，只是简单的形式，所以如果它们是嵌套的，我不希望父母出现，如
if form_row.hasChildren()没有为该父行输出html。 -
对，明白了，你的问题根本不清楚，因为你提到了 CSS 类，而你发布的 JavaScript 代码是切换 CSS 类，所以我试图找到你问题的根源即你真正想要做的事情。
-
很公平，我会更新问题
标签： php forms symfony twitter-bootstrap-3 twig