是否可以从表单生成器设计 html [英] Is it possible to design the html from form builder
问题描述
我在 buildForm() 中选择了表单
公共函数 buildForm(FormBuilderInterface $builder, array $options){$builder->add('icon','entity',大批('类' =>'UserBundle:IconPics','财产' =>'标签'，'扩展' =>真的，'数据' =>$默认图标，'多个' =>错误的，'标签' =>'form.icon','query_builder' =>功能($存储库){返回 $repository->createQueryBuilder('i')->add('where', 'i.enabled = true');},));在树枝上.
{{ form_widget(form.icon) }}它像这样显示单选按钮选择器 html.
<input type="radio" id="fos_user_registration_form_icon_3" name="fos_user_registration_form[icon]" required="required" value="3" checked="checked"/><label for="fos_user_registration_form_icon_3" class="required">male</label><input type="radio" id="fos_user_registration_form_icon_4" name="fos_user_registration_form[icon]" required="required" value="4"/><label for="fos_user_registration_form_icon_4" class="required">female</label><input type="radio" id="fos_user_registration_form_icon_5" name="fos_user_registration_form[icon]" required="required" value="5"/><label for="fos_user_registration_form_icon_5" class="required">老男</label><input type="radio" id="fos_user_registration_form_icon_6" name="fos_user_registration_form[icon]" required="required" value="6"/>然而，这个 html 并不酷，只需对齐单选按钮.我想设计这个html.比如使用表格什么的
<td>Button1</td><td>标签</td></tr></table>有可能吗?
<小时>感谢您的回复
我已阅读链接并选择了最简单的方式.
把它放在树枝的顶部并取得了一些进展.
但我面临两个问题
{% form_theme form _self %}{% 阻止 radio_widget %}<td><input type="radio" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}/></td>{% endblock radio_widget %}
它显示这样的html
<input type="radio" id="fos_user_registration_form_icon_3" name="fos_user_registration_form[icon]" required="required" value="3"/></td><label for="fos_user_registration_form_icon_3" class="required">male</label>1.问题
单选按钮在 td 标签内(好！！)，但标签在
外侧这个标签出现在哪里??????
如何删除或控制这个???
我了解此标签与我可以在 formBuilder 中选择的标签"不同.
2) 问题
当我使用已检查"作为示例时
{% if checked %} checked="checked"{% endif %}
它说这个检查的属性甚至在正常情况下使用form_div_layout.html.twig
我对此一无所知.
请帮帮我.谢谢
在第 7 行的 FOSUserBundle:Registration:register_content.html.twig 中不存在变量checked"500 内部服务器错误 - Twig_Error_Runtime
解决方案 您可以使用像
这样的新表单布局来覆盖 twig 中的表单主题{% form_theme formObject 'NamespaceYourBundle:Form:form_div_layout.html.twig' %}
并在 form_div_layout.html.twig 重新定义您的字段块，例如单选按钮，您可以自定义它
{% 阻止 radio_widget %}{% 无空间 %}<td><input type="radio" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %}/></td>{% endspaceless %}{% endblock radio_widget %}
对于标签块，你可以像
一样使用它{% 块 form_label %}{% 无空间 %}{% if label is not sameas(false) %}{% 如果不是复合 %}{% set label_attr = label_attr|merge({'for': id}) %}/* 你可以跳过这部分用于 td */{％ 万一 ％}{％ 如果需要的话 ％}{% set label_attr = label_attr|merge({'class': (label_attr.class|default('') ~ ' required')|trim}) %}{％ 万一 ％}{% 如果标签为空 %}{% 设置标签 = 名称|人性化 %}{％ 万一 ％}<td {% for attrname, attrvalue in label_attr %} {{ attrname }}="{{ attrvalue }}"{% endfor %}>{{ label|trans({}, translation_domain) }}</td>{％ 万一 ％}{% endspaceless %}{% endblock form_label %}
现在终于覆盖了展开的小部件
{% block choice_widget_expanded %}{% 无空间 %}<table {{ block('widget_container_attributes') }}>{% for child in form %}<tr>{{ form_widget(child) }}{{ form_label(child) }}</tr>{% 结束为 %}
{% endspaceless %}{% endblock choice_widget_expanded %}编辑覆盖choice_widget_expanded的标签块，你可以定义你的块并像下面一样使用它
{% block choice_widget_expanded %}{% 无空间 %}<table {{ block('widget_container_attributes') }}>{% for child in form %}<tr>{{ form_widget(child) }}{{ form_label_custom(child) }}</tr>{% 结束为 %}{% endspaceless %}{% endblock choice_widget_expanded %}对于自定义标签也是 form_label_custom 现在对于具有扩展属性的每个选择字段(并非所有字段)，您的新标签都将起作用
{% 块 form_label_custom %}{% 无空间 %}{% if label is not sameas(false) %}{% 如果不是复合 %}{% set label_attr = label_attr|merge({'for': id}) %}/* 你可以跳过这部分用于 td */{％ 万一 ％}{％ 如果需要的话 ％}{% set label_attr = label_attr|merge({'class': (label_attr.class|default('') ~ ' required')|trim}) %}{％ 万一 ％}{% 如果标签为空 %}{% 设置标签 = 名称|人性化 %}{％ 万一 ％}<td {% for attrname, attrvalue in label_attr %} {{ attrname }}="{{ attrvalue }}"{% endfor %}>{{ label|trans({}, translation_domain) }}</td>{％ 万一 ％}{% endspaceless %}{% endblock form_label_custom %}I made select form in buildForm()
public function buildForm(FormBuilderInterface $builder, array $options)
{
$builder->add('icon','entity',
array(
'class' => 'UserBundle:IconPics',
'property' => 'label',
'expanded' => true,
'data' => $defaultIcon,
'multiple' => false,
'label' => 'form.icon',
'query_builder' => function ($repository) {
return $repository->createQueryBuilder('i')
->add('where', 'i.enabled = true');
},
));
in twig.
{{ form_widget(form.icon) }}
it shows the radiobutton selector html like this.
<div id="fos_user_registration_form_icon">
<input type="radio" id="fos_user_registration_form_icon_3" name="fos_user_registration_form[icon]" required="required" value="3" checked="checked" />
<label for="fos_user_registration_form_icon_3" class="required">male</label>
<input type="radio" id="fos_user_registration_form_icon_4" name="fos_user_registration_form[icon]" required="required" value="4" />
<label for="fos_user_registration_form_icon_4" class="required">female</label>
<input type="radio" id="fos_user_registration_form_icon_5" name="fos_user_registration_form[icon]" required="required" value="5" />
<label for="fos_user_registration_form_icon_5" class="required">old male</label>
<input type="radio" id="fos_user_registration_form_icon_6" name="fos_user_registration_form[icon]" required="required" value="6" />
</div>
However,this html is not cool,just align the radio button. I would like to design this html. such as using table or something
<table><tr>
<td>Button1</td>
<td>label</td>
</tr></table>
Is it possible?
Thanks for your reply
I have read the link and choose the most simple way.
put this at the top of twig and made some progress.
But I am facing two problems
{% form_theme form _self %}
{% block radio_widget %}
<td>
<input type="radio" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}/>
</td>
{% endblock radio_widget %}
it shows the html like this
<td style="border-style:none;">
<input type="radio" id="fos_user_registration_form_icon_3" name="fos_user_registration_form[icon]" required="required" value="3"/></td>
<label for="fos_user_registration_form_icon_3" class="required">male</label>
1.problem
radio button is inside the td tag (good!!),but label is out side the
where does this label appears?????
how can I delete or control this???
I understood this label is defferent from the 'label' that I can choose at the formBuilder.
2) problem
when I use 'checked' as sample says
{% if checked %} checked="checked"{% endif %}
it says like this checked property is used in even normal form_div_layout.html.twig
I have no clue about this.
Please help me . thanks
Variable "checked" does not exist in FOSUserBundle:Registration:register_content.html.twig at line 7
500 Internal Server Error - Twig_Error_Runtime
You can override the form theme in twig by using your new form layout like
{% form_theme formObject 'NamespaceYourBundle:Form:form_div_layout.html.twig' %}
and in form_div_layout.html.twig redefine your field blocks like for radio button you can customize it
{% block radio_widget %}
{% spaceless %}
<td>
<input type="radio" {{ block('widget_attributes') }}{% if value is defined %} value="{{ value }}"{% endif %}{% if checked %} checked="checked"{% endif %} />
</td>
{% endspaceless %}
{% endblock radio_widget %}
For label block you can use it like
{% block form_label %}
{% spaceless %}
{% if label is not sameas(false) %}
{% if not compound %}
{% set label_attr = label_attr|merge({'for': id}) %} /* you can skip this part for td */
{% endif %}
{% if required %}
{% set label_attr = label_attr|merge({'class': (label_attr.class|default('') ~ ' required')|trim}) %}
{% endif %}
{% if label is empty %}
{% set label = name|humanize %}
{% endif %}
<td {% for attrname, attrvalue in label_attr %} {{ attrname }}="{{ attrvalue }}"{% endfor %}>{{ label|trans({}, translation_domain) }}</td>
{% endif %}
{% endspaceless %}
{% endblock form_label %}
And now finally override the expanded widget
{% block choice_widget_expanded %}
{% spaceless %}
<table {{ block('widget_container_attributes') }}>
{% for child in form %}
<tr>
{{ form_widget(child) }}
{{ form_label(child) }}
</tr>
{% endfor %}
</table>
{% endspaceless %}
{% endblock choice_widget_expanded %}
Edit to override label block for choice_widget_expanded you can define your block and use it like in below
{% block choice_widget_expanded %}
{% spaceless %}
<table {{ block('widget_container_attributes') }}>
{% for child in form %}
<tr>
{{ form_widget(child) }}
{{ form_label_custom(child) }}
</tr>
{% endfor %}
</table>
{% endspaceless %}
{% endblock choice_widget_expanded %}
And for the custom label too form_label_custom now for every choice field with expanded property (not all fields) your new label will be in action
{% block form_label_custom %}
{% spaceless %}
{% if label is not sameas(false) %}
{% if not compound %}
{% set label_attr = label_attr|merge({'for': id}) %} /* you can skip this part for td */
{% endif %}
{% if required %}
{% set label_attr = label_attr|merge({'class': (label_attr.class|default('') ~ ' required')|trim}) %}
{% endif %}
{% if label is empty %}
{% set label = name|humanize %}
{% endif %}
<td {% for attrname, attrvalue in label_attr %} {{ attrname }}="{{ attrvalue }}"{% endfor %}>{{ label|trans({}, translation_domain) }}</td>
{% endif %}
{% endspaceless %}
{% endblock form_label_custom %}
How to customize Form Rendering
这篇关于是否可以从表单生成器设计 html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
