尝试在 getElementId 不起作用的表单中注册后显示弹出窗口

我已经成功地创建了一个弹出窗口，以便在单击链接后使用 JavaScript onclick 事件显示，如下所示：

但是，我现在正试图弄清楚如何在不需要链接的情况下使其工作。我希望它在提交 php 表单时工作。所以基本上当有人注册时，我希望在帐户成功注册后出现一个弹出窗口。

我现在正在尝试这样做，但它根本不起作用

<form action="" method="POST">
  <div class="field">
    <label for="fullname">Full Name</label>
    <input type="text"  class="inputbar" name="fullname" value="<?php echo escape(Input::get('fullname')); ?>" required>
  </div>
  <div class="field">
    <label for="email">Email</label>
    <input type="email" class="inputbaremail" name="email" value="<?php echo escape(Input::get('email')); ?>" required>
  </div>
  <div class="field">
    <label for="username">Username</label>
    <input type="text" class="inputbar" name="username" value="<?php echo escape(Input::get('username')); ?>" autocomplete="off" required>
  </div>
  <div class="field">
    <label for="password">Choose a password</label>
    <input type="password" name="password" class="inputbarp" required>
  </div>
  <div class="field">
    <label for="password_again">Confirm password</label>
    <input type="password" name="password_again" class="inputbarp" required>
  </div>

  <input type="hidden" name="token" value="<?php echo Token::generate(); ?>">
  <label for="signinButton">
    <input id="signinButton" type="submit" value="Register">
  </label><br>
  <onsubmit = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">
    <div id="light" class="signInpopup"><a class="close" href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a>
      <?php $success;?>
    </div>

怎样才能改变我必须让它工作的东西？此外，Ajax是一个更好的方法，还是我应该放弃我正在尝试做的事情并以另一种方式完成它？

更新的代码：

<form action="" method="POST"
                                                 onsubmit="document.getElementById('light').style.display='block';
                                                document.getElementById('fade').style.display='block';
                                             return false;">
                        <div class="field">
                            <label for="fullname">Full Name</label>
                            <input type="text"  class="inputbar" name="fullname" value="<?php echo escape(Input::get('fullname')); ?>" required>
                        </div>
                        <div class="field">
                            <label for="email">Email</label>
                            <input type="email" class="inputbaremail" name="email" value="<?php echo escape(Input::get('email')); ?>" required>
                        </div>
                        <div class="field">
                            <label for="username">Username</label>
                            <input type="text" class="inputbar" name="username" value="<?php echo escape(Input::get('username')); ?>" autocomplete="off" required>
                        </div>
                        <div class="field">
                            <label for="password">Choose a password</label>
                            <input type="password" name="password" class="inputbarp" required>
                        </div>
                        <div class="field">
                            <label for="password_again">Confirm password</label>
                            <input type="password" name="password_again" class="inputbarp" required>
                        </div>

                        <input type="hidden" name="token" value="<?php echo Token::generate(); ?>">
                        <label for="signinButton">
                        <input id="signinButton" type="submit" value="Register">
                        </label><br>
                    <div id="light" class="signInpopup"><a class="close" href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a>
                        <?php $success;?>
                    </div>  
                    </form>