Incomplete form still submitting in PHP

When I fill the form one or two field in the form and click on register button, its still submitting those values. It should not submit till the all field complete in the form. What am I doing wrong???

I have added a <pre /> tag at the top so that I can check which values are entered, here is my code:

Start of file - PHP:

<?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;
}


?>

Continuing - HTML & PHP and Javascript: (this code is the same file)

<!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>

Answers 1

  • To Stop submitting the form you have to use the browser side validation i.e either use jquery validation or simple javascript.

    Or another way is use HTML 5 Validation i.e. required attribute in your input field.

    This will stop your form to submit until your all fields are fills and validate.

    After this use server side validation, check if any of the field is empty then return and highlight that particular field.


Related Articles