第一次重新加载后的空会话变量

Question

我有一个模态用户帐户的注册表单，并从我的模板“base.html.twig”中调用。我希望如果提交后存在表单错误（在实体级别检查约束），我希望重新显示我的模态表单。

因此，为此，在我的控制器处理注册时，如果表单无效，我会创建一个会话变量。然后，在我的模板“base.html.twig”中检查会话变量是否存在。如果是，那么我在模态 div 级别将数据可见性属性传递给 1。最后，在 JavaScript 中，如果此数据可见性属性为 1，我将显示上述 div。

我的问题是，如果出现错误，提交后表单不会自动重新显示。我必须自己点击按钮才能这样做。

在这里，在屏幕截图中，流程试图让我更好地理解。

我点击帐户创建按钮：

我通过明确编码错误来完成模态形式：

我提交表格：

提交后，尽管存在错误，但表单没有重新显示：

我必须点击“注册”按钮才能再次显示表单：

这是有问题的，因为最终用户不会知道有错误，然后必须重新点击“注册”按钮。

这是我的代码。

在我的模板“base.html.twig”中：

...
      {% if app.session.get('errorFomRegistration') %}
        <div id="registrationModal" class="modal fade" role="dialog" data-visibility='1'>
      {% else %}
        <div id="registrationModal" class="modal fade" role="dialog" data-visibility='0'>
      {% endif %}
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <h4 class="modal-title">Sign up</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                </button>
              </div>
              <div class="modal-body">
                <div>
                  {% if app.session.get('errorFomRegistration') %}
                    {{ include('_messages.html.twig') }}
                  {% endif %}
                </div>
                {{ render(controller('App\\Controller\\security\\SecurityController::registration', {'request': app.request})) }}
              </div>
            </div>
          </div>
        </div>
        </div>
...

在我的控制器“SecurityController.php”中：

    /**
     * User registration
     * 
     * @Route("/security/registration/{shortForm}", name="security.registration")
     *
     * @param bool $shortForm
     * @param Request $request
     * @param EntityManagerInterface $manager
     * @param UserPasswordEncoderInterface $encoder
     * @param AuthorizationCheckerInterface $authChecker
     * @param \Swift_Mailer $mailer
     * @param UserRepository $userRepository
     * 
     * @return Response
     */
    public function registration(bool $shortForm = false, Request $request, EntityManagerInterface $manager, UserPasswordEncoderInterface $encoder, 
                                  AuthorizationCheckerInterface $authChecker, \Swift_Mailer $mailer, UserRepository $userRepository): Response
    {

        $session = $this->get('session');

        $session->set('errorFomRegistration', false);
...
        $form->handleRequest($request);

        if ($form->isSubmitted())
        {

            if ($form->isValid())
            {
...
            }
            else 
            {

                $session->set('errorFomRegistration', true);
                \dump($session->get('errorFomRegistration'));

            }

        }
...

最后，在我的 app.js 中：

...
  // Display the login modal form if there is an autentication error
  var $registrationDiv = $('#registrationModal');

  console.log('Before display');

  if($registrationDiv.data('visibility') == '1')
  {

    console.log('Visible');

    $registrationDiv.modal('show');

  }
...

谁有办法让我摆脱这个我已经尝试了几个星期的问题？

提前感谢您的帮助。

Answer 1

我在 Laravel 中做过同样的事情。您需要在 if 条件内的模态打开按钮上应用 javascript click() 方法。