3

国の複数選択リストを含むフォームビルダーフォームがあります。次のようにフォームにレンダリングすると:

{{ form_widget(edit_form.countries) }}

それらは次のように表示されます。

<input type="checkbox" name="..." value="AD" /><label for="...">Andorra</label>
<input type="checkbox" name="..." value="AE" /><label for="...">United Arab Emirates</label>
<input type="checkbox" name="..." value="AF" /><label for="...">Afghanistan</label>

すべてのオプションを一列に表示するのではなく、ブラウザの個別の行に各オプションを表示したいと思います。オプションの前後または間に html を挿入するにはどうすればよいですか? または、これを達成するための CSS メソッドはありますか?

ありがとう。

4

3 に答える 3

16

symfony のドキュメントから

基本的に行う必要があるのは、checkbox_widgetブロックをオーバーロードすることです。

{% form_theme form _self %}

{% block checkbox_widget %}
{% spaceless %}
    <input type="checkbox" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />
{% endspaceless %}
{% endblock checkbox_widget %}

もちろん、CSS を使用して独自の行にウィジェットを配置することもできます (ただし、これは Symfony2 の問題ではありません)。

于 2011-12-20T10:21:27.607 に答える
8

これを行うために私が見つけた怠惰な方法は、フォーム/選択配列を反復処理することでした。

最も単純なフォームのレンダリングでは、次のようにします。

{{ form_widget(form) }}

もう少し粒度を上げるには、次のようにします。

{{ form_row(form.itemA) }}
{{ form_row(form.itemB) }}
{{ form_row(form.itemC) }}

しかし、「itemA」が複数選択の場合、リスト全体が同じ行に表示されてしまいます。テーマにステップアップする前に、もう少し細分化したい場合は、次のようにします。

{% for t in form.itemA %}
{{ form_row(t) }}
{% endfor %}

これにより、各チェックボックスが独自の行にレンダリングされるか、各項目間で必要なことを行う機会が与えられます。

于 2012-07-18T08:38:28.540 に答える
1

Kuba が彼の回答で述べたように、これは部分的に CSS の質問のように聞こえます。意味的に言えば、<br />タグのようなものを挿入することはあまり意味がありませんが、必要に応じて、Kuba's answer のドキュメントに従ってそれを行うことができます。

これらの要素を 1 行ずつ表示する CSS を書きたい場合は、symfony のデフォルト出力に対してこれを使用できます。

input, label {
    float: left;
}

input {
    clear: left;
}

もちろん、これにより実際にはすべての入力タグとラベルタグが左にフロートするため、適切ではない可能性があるため、a)チェックボックスを別の div でラップし、css サブセレクターを使用する.checkboxes input, .checkboxes labelか、b)カスタム css クラスを以下を使用するウィジェット:

{{ form_widget(form.name, { 'attr': {'class': 'foo'} }) }}

inputCSSは同じですが、代わりに.foo.

于 2011-12-20T22:27:12.457 に答える