php和javascript表单验证问题

4 html javascript php forms validation

我使用bootstrap创建了一个表单,并使用javascript进行表单验证,然后使用php脚本来获取发布数据并显示它

基本结构如下,我尽可能地解决了这个具体问题.我遇到的问题是检查表单验证的脚本<script>在正文末尾的标记中完美地工作,但不是阻止页面被提交,它应该仍然处理到具有表单内容的下一页post当表单确实没有正确填写时,这是通过php 动作制作的.

为什么是这样?如果表单尚未正确提交,则表单验证仍然不会停止页面转移到帖子数据,因为验证返回false.所有表单验证警报都会正确弹出并且我在检查后没有出现控制台错误,或者我是否需要执行额外的检查以仅在表单有效时处理发布数据?

<html>
   other tags.....
   <body>
      <form name = "OrderForm" action = "process_order.php" onsubmit = "orderbutton" method = "post">
          a bunch of content, divs, checkboxes, etc
      </form>
   </body>
   <script>

            function CheckForm() {
                    var Name = document.getElementById("Name");
                    var fries = document.forms.OrderForm.FryRadio;
                    var fryyes = fries[0].checked
                    var fryno = fries[1].checked

                    var bool = true;

                    if ((Name.value == "" || Name.value == "Name") || (!(document.getElementById("SandwichRadio").checked || document.getElementById("WrapRadio").checked)))  {
                         bool = false;
                    }

                    else if (!(fryyes || fryno)) {
                        bool = false;
                    }

                    if (!(bool)) {
                        alert("Please fill out all of the required fields.");
                        return false;
                    }
                    else {
                        alert("Your order is being submitted");
                        console.log("Submitted")
                    }

            };

    </script>
</html>
Run Code Online (Sandbox Code Playgroud)

Pra*_*tik 5

你应该在提交时调用函数,我不知道你用当前的onsubmit ='...'做了什么

因此,在提交表单时使用以下调用函数.

  <form name = "OrderForm" action = "process_order.php" onsubmit = "return CheckForm()" method = "post">
      a bunch of content, divs, checkboxes, etc
  </form>
Run Code Online (Sandbox Code Playgroud)

对于演示:检查小提琴