不完整的表单仍在PHP中提交

时间:2016-03-30 05:38:50

标签: php jquery validation

当我在表单中填写一个或两个字段并单击注册按钮时,它仍然提交这些值。它不应该提交,直到表格中的所有字段完成。我究竟做错了什么???

我在顶部添加了<?php $error_array = array(); $fname = $lname = $email = $dob = $Mchecked = $gender = $Fchecked = $hobbies =""; if(isset($_POST["sbt_save"])) { echo '<pre>'; print_r($_POST); echo "</pre>"; if($_POST['fname']=="") { $err ="Please Enter your first name"."<br>"; array_push($error_array,$err); } else { $fname = test_input($_POST['fname']); } if($_POST['lname']=="") { $err ="Please Enter your last name"."<br>"; array_push($error_array,$err); $submit_Ornot_submit = true; } else { $lname = test_input($_POST["lname"]); } if($_POST['email']=="") { $err ="Please Enter your email"."<br>"; array_push($error_array,$err); } else { $email_Value = $_POST['email']; $position_Of_at = strpos("$email_Value","@"); $position_Of_dot = strpos("$email_Value","."); if($position_Of_at == -1 || $position_Of_dot == -1 || ($position_Of_at + 2) >= $position_Of_dot ) { $err = "Please enter valid Email"."<br>"; array_push($error_array,$err); } else { $email = test_input($_POST["email"]); } } if($_POST['dob']=="") { $err ="Please Enter your date of birth"."<br>"; array_push($error_array,$err); } else { $dob = test_input($_POST["dob"]); } if(!isset($_POST["gender"])) { $err ="Please select gender"."<br>"; array_push($error_array,$err); } else { $gender = $_POST["gender"]; if ($gender == "Male") { $Mchecked = "checked"; } else if ($gender == "Female") { $Fchecked = "checked"; } } if(!isset($_POST['hobbies'])) { $err ="Please Enter your hobbies"."<br>"; array_push($error_array,$err); } else { $hobbies = test_input($_POST['hobbies']); } } function test_input($data) { $data = trim($data); $data = stripslashes($data); $data = htmlspecialchars($data); return $data; } ?> 标记,以便我可以检查输入的值,这是我的代码:

文件开头 - PHP:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ragistration Form</title>
<link rel="stylesheet" type="text/css" href="ragistration_form.css">

<script src="jquery-2.2.1.min.js"></script>
<script>
/*
$(document).ready(function(event)
{    
    $(".sbt_button").click(function(event)
    {        
        var error_arr = [];             
        var email_value = $("#email").val();                    
        var position_of_at  = email_value.indexOf('@');         
        var position_of_dot = email_value.lastIndexOf('.');



        if($("#fname").val() == null || $("#fname").val() == "")
        {
             var err = "First Name";
             error_arr.push(err);
        }

        if($("#lname").val() == null || $("#lname").val() == "")
        {
            var err = "Last Name ";
            error_arr.push(err);
        }
        if(position_of_at == -1 || position_of_dot == -1 || (position_of_at + 2) >= position_of_dot )
        {
            var err = "Email ";
            error_arr.push(err);
        }

        if($("#dob").val() == null || $("#dob").val() == "")
        {
            var err = "Date of Birth ";
            error_arr.push(err);
        }

        if(!$("input[type='radio']").is(":checked"))
        {
            var err = "Gender ";
            error_arr.push(err);
        }

        if(!$("input[type='checkbox']").is(":checked"))
        {
            var err = "Hobbies ";
            error_arr.push(err);
        }


        if(error_arr.length !=0)
        {
            event.preventDefault(); 
            alert(error_arr);   
        }           
    });
});

*/
</script>

</head>
<body>
<form class="form" name="myForm" action="" method="POST">
  <table>
    <tr>
      <p class="heading">Ragistration Form</p>
    </tr>
    <?php
if($error_array !="")
{   
    foreach($error_array as $value)
    {       
        echo "<tr style='color:red;'><td> ". $value. "</td></tr>";                  
    }
}

?>
    <tr>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td class="field_Name">First Name :<b style="color:red">*</b></td>
      <td><input type="text" name="fname" id="fname" class="inputfield_Name"  /></td>
    </tr>
    <tr>
      <td class="field_Name">Last Name :<b style="color:red">*</b></td>
      <td><input type="text" name="lname" id="lname" class="inputfield_Name"  /></td>
    </tr>
    <tr>
      <td class="field_Name">Email :<b style="color:red">*</b></td>
      <td><input type="text" name="email" id="email" class="inputfield_Name"   /></td>
    </tr>
    <tr>
      <td class="field_Name">Date of Birth :<b style="color:red">*</b></td>
      <td><input type="date" name="dob" id="dob"  class="inputfield_Name"   /></td>
    </tr>
    <tr>
      <td class="field_Name">Gender :<b style="color:red">*</b></td>

        <td><input type="radio" name="gender" value="Male"class="inputfield_Name" <?php echo $Mchecked;?>   />Male
        <input type="radio" name="gender" value="Female" <?php echo $Fchecked;?>    />
        Female</td>


    </tr>
    <tr>
      <td class="field_Name">About Yourself :</td>
      <td><textarea name="abt" class="inputfield_Name"$></textarea></td>
    </tr>
    <tr>
      <td class="field_Name">Hobbies :<b style="color:red">*</b></td>
      <td><input name="hobbies" value="Cricket"  type="checkbox" id="hobbies"  class="inputfield_Name"    />
        Cricket
        <input name="hobbies" value="Singing"   type="checkbox"   />
        Singing
        <input name="hobbies" value="Travling"   type="checkbox"  />
        Travling</td>
    <tr>
      <td></td>
      <td><input name="hobbies"  value="Writing"  type="checkbox"  class="inputfield_Name"  />
        Writing
        <input name="hobbies"  value="Teaching"  type="checkbox"   />
        Teaching
        <input name="hobbies"  value="Driving"  type="checkbox"   />
        Driving </td>
    </tr>
    <tr>
      <td></td>
      <td><input type="submit" value="Ragister" name="sbt_save"  class="sbt_button"/></td>
        </td>
    </tr>
  </table>
</form>
</body>
</html>

继续 - HTML&amp; PHP和Javascript :(此代码是相同的文件)

{{1}}

5 个答案:

答案 0 :(得分:1)

您的可行 HTML + Jquery 代码和 PHP 代码的其余部分都可以。 PHP 不会阻止表单提交。您可以通过 HTML required字段)并使用 Jquery

阻止表单提交

$(document).ready(function(event)
{    
    $(".sbt_button").click(function(event)
    {        
        var error_arr = [];             
        var email_value = $("#email").val();                    
        var position_of_at  = email_value.indexOf('@');         
        var position_of_dot = email_value.lastIndexOf('.');



        if($("#fname").val() == null || $("#fname").val() == "")
        {
             var err = "First Name";
             error_arr.push(err);
        }

        if($("#lname").val() == null || $("#lname").val() == "")
        {
            var err = "Last Name ";
            error_arr.push(err);
        }
        if(position_of_at == -1 || position_of_dot == -1 || (position_of_at + 2) >= position_of_dot )
        {
            var err = "Email ";
            error_arr.push(err);
        }

        if($("#dob").val() == null || $("#dob").val() == "")
        {
            var err = "Date of Birth ";
            error_arr.push(err);
        }

        if(!$("input[type='radio']").is(":checked"))
        {
            var err = "Gender ";
            error_arr.push(err);
        }

        if(!$("input[type='checkbox']").is(":checked"))
        {
            var err = "Hobbies ";
            error_arr.push(err);
        }


        if(error_arr.length !=0)
        {
            event.preventDefault(); 
            alert(error_arr);   
        }           
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<form class="form" name="myForm" action="" method="POST">
  <table>
    <tr>
      <p class="heading">Ragistration Form</p>
    </tr>
    
    <tr>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td class="field_Name">First Name :<b style="color:red">*</b></td>
      <td><input type="text" name="fname" id="fname" class="inputfield_Name"  /></td>
    </tr>
    <tr>
      <td class="field_Name">Last Name :<b style="color:red">*</b></td>
      <td><input type="text" name="lname" id="lname" class="inputfield_Name"  /></td>
    </tr>
    <tr>
      <td class="field_Name">Email :<b style="color:red">*</b></td>
      <td><input type="text" name="email" id="email" class="inputfield_Name"   /></td>
    </tr>
    <tr>
      <td class="field_Name">Date of Birth :<b style="color:red">*</b></td>
      <td><input type="date" name="dob" id="dob"  class="inputfield_Name"   /></td>
    </tr>
    <tr>
      <td class="field_Name">Gender :<b style="color:red">*</b></td>

        <td><input type="radio" name="gender" value="Male"class="inputfield_Name"  />Male
        <input type="radio" name="gender" value="Female"    />
        Female</td>


    </tr>
    <tr>
      <td class="field_Name">About Yourself :</td>
      <td><textarea name="abt" class="inputfield_Name"$></textarea></td>
    </tr>
    <tr>
      <td class="field_Name">Hobbies :<b style="color:red">*</b></td>
      <td><input name="hobbies" value="Cricket"  type="checkbox" id="hobbies"  class="inputfield_Name"    />
        Cricket
        <input name="hobbies" value="Singing"   type="checkbox"   />
        Singing
        <input name="hobbies" value="Travling"   type="checkbox"  />
        Travling</td>
    <tr>
      <td></td>
      <td><input name="hobbies"  value="Writing"  type="checkbox"  class="inputfield_Name"  />
        Writing
        <input name="hobbies"  value="Teaching"  type="checkbox"   />
        Teaching
        <input name="hobbies"  value="Driving"  type="checkbox"   />
        Driving </td>
    </tr>
    <tr>
      <td></td>
      <td><input type="submit" value="Ragister" name="sbt_save"  class="sbt_button"/></td>
        </td>
    </tr>
  </table>
</form>

答案 1 :(得分:1)

您可以使用 PHP 直接管理它,而不是jquery。

也尝试检查NULL条件。这是代码。

if($_POST['fname']=="" || $_POST['fname']==null)
    {           
        $err ="Please Enter your first name"."<br>";
        array_push($error_array,$err);      
    }
    else
    {
        $fname = test_input($_POST['fname']);       
    }

如果您希望使用 HTML 完成,只需在输入类型中添加required属性。

就像:

<input type="text" name="fname" id="fname" required>

答案 2 :(得分:0)

1.检查任何文本框是否为空,然后检查提交按钮是否已被阻止

if( isset($_POST['fname']) && 
    isset($_POST['lname']) &&
    isset($_POST['email']) &&
    isset($_POST['dob']) &&
    isset($_POST["gender"]) &&
    isset($_POST['hobbies'])
  )  {  
         //your php code here 
     } else {  echo "Please complete the form"; }                   

2.使用Javascript表单验证

<form class="form" name="myForm" action="" method="POST"  onsubmit="return validateForm();">

<script>function validateForm() {  
    //your form validation code here 
} </script>

答案 3 :(得分:0)

您需要检查表单值。所以做这样的事情。

if(isset($_POST["sbt_save"]))
{   

把这段代码

if($_POST['dob']=="" || $_POST['email']=="" || $_POST['lname']=="" || $_POST['gender'] == ""]){

$err ="Please Enter all form fields"."<br>";
        array_push($error_array,$err); }else{

你的其余代码......

同时查看jquery validator plugin。某些浏览器(如移动版Safari)无法识别所需的标记,并会提交表单。

答案 4 :(得分:0)

要停止提交表单,您必须使用浏览器端验证,即使用jquery验证或简单的javascript。

或者另一种方法是使用HTML 5验证,即输入字段中的必需属性。

这将阻止您的表单提交,直到您的所有字段都填写并验证为止。

使用服务器端验证后,检查是否有任何字段为空,然后返回并突出显示该特定字段。