7

我在 Symfony2 上有一个联系表,其中我将一些验证器作为电子邮件、minLength 等。所有这些字段也设置为 notBlank。

因此,HTML5 也在验证这些字段(对于电子邮件而不是空白),这对我来说很好。

我有一个提交按钮:

<input type="submit" value="Submit"/>

问题是我有另一个提交按钮,它是一个取消按钮:

<input name="cancel" type="submit" value="Cancel" />

使用此按钮,在我的控制器中,我正在执行重定向:

if( $request->get('cancel') == 'Cancel' )
    return  $this->redirect($this->generateUrl('SciForumVersion2Bundle_homepage'));

现在,由于 HTML5 验证,我无法重定向,因为例如字段为空。

为了解决这个问题,我找到了两种解决方案,但我不喜欢它们:

  1. 禁用 HTML 5 验证:

    <form novalidate>
    
  2. 使用 JavaScript

但正如我所说,我不喜欢这些方法,而且我确信有一些不错的 Symfony 方法可以解决这个问题。

任何想法?非常感谢。

4

6 回答 6

19

使用以下命令专门为取消按钮禁用表单验证formnovalidate

<input name="cancel" type="submit" value="Cancel" formnovalidate/>
于 2013-06-07T20:34:41.810 回答
6

我看到这是一个较旧的线程,但我想提供一个替代解决方案,以防其他人发现它有用。我对这个主题的其他答案不满意,因为我想做三件事:

  • 不必在每个视图模板中进行任何自定义表单渲染(我喜欢使用{{ form(form) }}
  • 让取消按钮出现在提交按钮旁边(令人惊讶的是,如果你不进行自定义渲染,symfony 默认将所有表单按钮包装在一个 div 标签中)
  • 能够将取消操作设置为控制器中的一个选项,因为链接会根据我是添加还是编辑等而有所不同

我想在应用 DRY 原则的同时完成这一切。首先,我扩展了基本表单类型以允许自定义选项“cancel_action”:

<?php
namespace AcmeBundle\Form\Extension;

use Symfony\Component\Form\AbstractTypeExtension;
use Symfony\Component\Form\FormInterface;
use Symfony\Component\Form\FormView;
use Symfony\Component\OptionsResolver\OptionsResolver;

class FormTypeExtension extends AbstractTypeExtension
{
    /**
     * {@inheritdoc}
     */
    public function configureOptions(OptionsResolver $resolver)
    {
        parent::configureOptions($resolver);

        $resolver->setDefined('cancel_action');
        $resolver->setAllowedTypes('cancel_action', 'string');
    }

    /**
     * {@inheritdoc}
     */
    public function buildView(FormView $view, FormInterface $form, array $options)
    {
        parent::buildView($view, $form, $options);

        if (isset($options['cancel_action'])) {
            $view->vars['cancel_action'] = $options['cancel_action'];
        }
    }

    /**
     * {@inheritdoc}
     */
    public function getExtendedType()
    {
        return 'form';
    }
}

并在我的配置中注册了该表单类型扩展名(使用别名“form”,以便它可用于我的所有表单):

acme.form_type_extension:
    class: AcmeBundle\Form\Extension\FormTypeExtension
    tags:
        - {name: form.type_extension, alias: form}

然后我使用表单主题来扩展基本表单视图(我扩展了 submit_widget 块,以便取消按钮位于 div 标签内的提交按钮旁边):

{# AcmeBundle:Form:fields.html.twig #}

{% extends 'form_div_layout.html.twig' %}

{%- block submit_widget -%}
    {%- set type = type|default('submit') -%}
    {{ block('button_widget') }}
    {% if form.parent.vars.cancel_action is defined %}
        <a class="btn btn-default" href="{{ form.parent.vars.cancel_action }}" role="button">Cancel</a>
    {% endif %}
{%- endblock submit_widget -%}

并在我的 twig 配置中注册了该表单主题,以便它默认应用于所有表单视图:

twig:
    form_themes:
        - 'AcmeBundle:Form:fields.html.twig'

瞧!现在对于每个表单,如果我想要一个取消按钮,我需要做的就是在控制器中初始化表单时将取消操作指定为一个选项:

$form = $this->createForm(new AlbumType(), $album, array(
    'cancel_action' => $this->generateUrl('album_home')
));
于 2015-07-02T14:58:59.447 回答
3

我恢复我的评论:)

当处理表单(HTML5 与否)并且您想退出时,您不需要提交和验证任何数据您只需放置一个简单的 href 链接即可更改页面。使用你最喜欢的 css 样式来拥有相同的外观

提示:当用户更改输入值时,您可以收听 javascript 事件“onbeforeunload” 。它提醒用户他将退出页面

希望它有所帮助!

于 2013-02-11T08:30:33.147 回答
3
->add('cancel', 'submit', array(
            'label' => 'Cancel',
            'attr' => array(                       
                    'formnovalidate'=>'formnovalidate'
            ) 
    ))
于 2015-12-04T22:32:06.683 回答
0

我们可以通过formnovalidate使用 HTML5 required 属性轻松禁用表单验证

于 2015-02-19T09:30:38.437 回答
0

你也可以这样做:

<button name="cancel" type="submit" value="Cancel" formnovalidate>Cancel</button>
于 2021-11-08T14:07:24.180 回答