In html posting a form with javascript and php validation.. one fault- return true or false goes into text box of form

The form works, except, the value of true or false, gets put into the 'messagetxt' and that is the message I receive through email. I found the easiest way to create a continual alert box for invalid data, was to create a second contact page with an automatic alert upon loading.

    //this is on page contact.html
//head etc..
<body>
<form  action="email.php" method="post" name="contact" >
          First Name:
          <input type="text" placeholder="First Name" name="fname" id="fname" />
          Last Name:
          <input type="text" placeholder="Last Name" name="lname" id="lname"/>
          Email Address:
          <input type="email" placeholder="Email Address" name="email"  id="email"/>
          Message:
          <input type="text" placeholder="Message" name="messagetxt" id="messagetxt"/>
          <input type="submit" value="submit" />
        </form>
        <script type="text/javascript">
  var inputElem = document.getElementById('fname'); 
        var inputElem = document.getElementById('lname');
          var inputElem = document.getElementById('email');
            var inputElem = document.getElementById('messagetxt');
             var form = document.getElementsByTagName('form')[0];
form.onsubmit = function (){
if (inputElem.value = '' || inputElem.value.length < 1){
        alert('Please plete all fields'); 
        return false; 
    }
};
</script>
</body>
</html>


//===
//this is on a page contacterror.html
//head etc..
<body>
<form  action="email.php" method="post" name="contact" >
          First Name:
          <input type="text" placeholder="First Name" name="fname" id="fname" />
          Last Name:
          <input type="text" placeholder="Last Name" name="lname" id="lname"/>
          Email Address:
          <input type="email" placeholder="Email Address" name="email"  id="email"/>
          Message:
          <input type="text" placeholder="Message" name="messagetxt" id="messagetxt"/>
          <input type="submit" value="submit" />
        </form>
        <script type="text/javascript">
  var inputElem = document.getElementById('fname'); 
        var inputElem = document.getElementById('lname');
          var inputElem = document.getElementById('email');
            var inputElem = document.getElementById('messagetxt');
             var form = document.getElementsByTagName('form')[0];
form.onsubmit = function (){
if (inputElem.value = '' || inputElem.value.length < 1){
        alert('Please plete all fields'); 
        return false; 
    }
};
</script>
<script type="text/javascript">
alert("Please plete all fields");
</script>
</body>
</html>


//===
//this is my email.php
<body>
<?php

function spamcheck($field)
  {
  //filter_var() sanitizes the e-mail
  //address using FILTER_SANITIZE_EMAIL
  $field=filter_var($field, FILTER_SANITIZE_EMAIL);

  //filter_var() validates the e-mail
  //address using FILTER_VALIDATE_EMAIL
  if(filter_var($field, FILTER_VALIDATE_EMAIL))
    {
    return TRUE;
    }
  else
    {
    return FALSE;
    }
  }

if ($_SERVER['REQUEST_METHOD'] == 'POST') {


    //process form data
  //check if the email address is invalid
  $mailcheck = spamcheck($_POST['email']);
  if ($mailcheck==FALSE)
    {
    header ("Location:contacterror.html");
            }

else
      {
  //send email
  $email=$_POST['email'];
  $fname=$_POST['fname'];
  $lname=$_POST['lname'];
  $message = $_POST['messagetxt'] ;
  $subject="website contact";
  mail("[email protected]", $subject ,$message , "From: $email");
  echo "Thank you for using our mail form.";
  }

  }
else
  {//if "email" is not filled out, display the form
   header ("Location:contacterror.html");
        }

include ("contact.html");

?>
</body>

Is anybody able to help?

    //this is on page contact.html
//head etc..
<body>
<form  action="email.php" method="post" name="contact" >
          First Name:
          <input type="text" placeholder="First Name" name="fname" id="fname" />
          Last Name:
          <input type="text" placeholder="Last Name" name="lname" id="lname"/>
          Email Address:
          <input type="email" placeholder="Email Address" name="email"  id="email"/>
          Message:
          <input type="text" placeholder="Message" name="messagetxt" id="messagetxt"/>
          <input type="submit" value="submit" />
        </form>
        <script type="text/javascript">
  var inputElem = document.getElementById('fname'); 
        var inputElem = document.getElementById('lname');
          var inputElem = document.getElementById('email');
            var inputElem = document.getElementById('messagetxt');
             var form = document.getElementsByTagName('form')[0];
form.onsubmit = function (){
if (inputElem.value = '' || inputElem.value.length < 1){
        alert('Please plete all fields'); 
        return false; 
    }
};
</script>
</body>
</html>


//===
//this is on a page contacterror.html
//head etc..
<body>
<form  action="email.php" method="post" name="contact" >
          First Name:
          <input type="text" placeholder="First Name" name="fname" id="fname" />
          Last Name:
          <input type="text" placeholder="Last Name" name="lname" id="lname"/>
          Email Address:
          <input type="email" placeholder="Email Address" name="email"  id="email"/>
          Message:
          <input type="text" placeholder="Message" name="messagetxt" id="messagetxt"/>
          <input type="submit" value="submit" />
        </form>
        <script type="text/javascript">
  var inputElem = document.getElementById('fname'); 
        var inputElem = document.getElementById('lname');
          var inputElem = document.getElementById('email');
            var inputElem = document.getElementById('messagetxt');
             var form = document.getElementsByTagName('form')[0];
form.onsubmit = function (){
if (inputElem.value = '' || inputElem.value.length < 1){
        alert('Please plete all fields'); 
        return false; 
    }
};
</script>
<script type="text/javascript">
alert("Please plete all fields");
</script>
</body>
</html>


//===
//this is my email.php
<body>
<?php

function spamcheck($field)
  {
  //filter_var() sanitizes the e-mail
  //address using FILTER_SANITIZE_EMAIL
  $field=filter_var($field, FILTER_SANITIZE_EMAIL);

  //filter_var() validates the e-mail
  //address using FILTER_VALIDATE_EMAIL
  if(filter_var($field, FILTER_VALIDATE_EMAIL))
    {
    return TRUE;
    }
  else
    {
    return FALSE;
    }
  }

if ($_SERVER['REQUEST_METHOD'] == 'POST') {


    //process form data
  //check if the email address is invalid
  $mailcheck = spamcheck($_POST['email']);
  if ($mailcheck==FALSE)
    {
    header ("Location:contacterror.html");
            }

else
      {
  //send email
  $email=$_POST['email'];
  $fname=$_POST['fname'];
  $lname=$_POST['lname'];
  $message = $_POST['messagetxt'] ;
  $subject="website contact";
  mail("[email protected]", $subject ,$message , "From: $email");
  echo "Thank you for using our mail form.";
  }

  }
else
  {//if "email" is not filled out, display the form
   header ("Location:contacterror.html");
        }

include ("contact.html");

?>
</body>

Is anybody able to help?

Share Improve this question edited Aug 22, 2013 at 15:38 asked May 11, 2013 at 2:54 user3956566

1 if (inputElem.value == '' || ... – Casimir et Hippolyte Commented May 11, 2013 at 3:07

Add a ment |

3 Answers 3

Sorted by: Reset to default 7

You want to take a look at your javascript. It seems to be causing the message textbox to return false upon reloading the page. If you remove the javascript or place it in the head of your page, this should take care of the issue. Also, the variable inputElem should be changed for each element that you want to retrieve. Your variable is overwriting itself everytime you call getElementById(). Try something like this:

    <!doctype>
<html>
<head>
    <meta charset='utf-8'>
    <script type="text/javascript">

        function Validate()
        {
            // create array containing textbox elements
            var inputs = [document.getElementById('fname'), document.getElementById('lname'), document.getElementById('email'), document.getElementById('messagetxt')];

            var error;

            for(var i = 0; i<inputs.length; i++)
            // loop through each element to see if value is empty
            {
                if(inputs[i].value == '')
                {
                    error = 'Please plete all fields.';
                }
            }
            if(error)
            {
                alert(error);
                return false;
            }
        }
</script>
</head>
<body>
<form action='email.php' method="POST" name="contact" >
          First Name:
          <input type="text" placeholder="First Name" name="fname" id="fname" />
          Last Name:
          <input type="text" placeholder="Last Name" name="lname" id="lname"/>
          Email Address:
          <input type="email" placeholder="Email Address" name="email"  id="email"/>
          Message:
          <input type="text" placeholder="Message" name="messagetxt" id="messagetxt"/>
          <input type="submit" value="submit" onClick="return Validate();"/>
        </form>
</body>
</html>

use <input type="submit" value="submit" name="submit"/>

and also replace

if ($_SERVER['REQUEST_METHOD'] == 'POST') {

with

if (isset($_POST['submit'])) {

First if check if your form method is POST. it does not necessary mean if the user submit the form with pressing submit button.but the second if check if the user really submit the form with pressing submit button

I rectified my code, with thanks to Steel and Amir, this is neater, less plicated and works.

I thought I'd post this, as it is useful for others.

This provides a client and server side check against spamming the email address. I've removed excess error handling, removed the extra html, forcing an error alert.

//javascript in head with loop to check fields 

 <script type="text/javascript">    
        function Validate()
        {
            // create array containing textbox elements
            var inputs = [document.getElementById('fname'), document.getElementById('lname'), document.getElementById('email'), document.getElementById('messagetxt')];    
            var error;

            for(var i = 0; i<inputs.length; i++)
            // loop through each element to see if value is empty
            {
                if(inputs[i].value == '')
                {
                    error = 'Please plete all fields.';
                }
            }
            if(error != null)
            {
              alert(error);
                return false;
            }
        }
</script>
</head>    

//amended form
<body>
<form  action="email.php" method="post" name="contact" >
          First Name:
          <input type="text" placeholder="First Name" name="fname" id="fname" />
          Last Name:
          <input type="text" placeholder="Last Name" name="lname" id="lname"/>
          Email Address:
          //===
          // input type 'email' - client side check for spam
          <input type="email" placeholder="Email Address" name="email"  id="email"/>
          Message:
          <input type="text" placeholder="Message" name="messagetxt" id="messagetxt"/>
          <input type="submit" value="submit" name="submit" onclick="Validate ()" />
        </form>

        </body>
</html>

//amended php

<body>
<?php

//==
//server side check for spam
function spamcheck($field)
  {
  //filter_var() sanitizes the e-mail
  //address using FILTER_SANITIZE_EMAIL
  $field=filter_var($field, FILTER_SANITIZE_EMAIL);

  //filter_var() validates the e-mail
  //address using FILTER_VALIDATE_EMAIL
  if(filter_var($field, FILTER_VALIDATE_EMAIL))
    {
    return TRUE;
    }
  else
    {
    return FALSE;
    }
  }

if (isset($_POST['submit'])) {

    //process form data
  //check if the email address is invalid
  $mailcheck = spamcheck($_POST['email']);
 if ($mailcheck==TRUE){

  //send email
  $email=$_POST['email'];
  $fname=$_POST['fname'];
  $lname=$_POST['lname'];
  $message = $_POST['messagetxt'] ;
  $subject="website contact";
  mail("[email protected]", $subject ,$message , "From: $email");
  echo "Thank you for using our mail form.";
 }}

include ("contact.html");

?>
</body>
</html>

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

In html posting a form with javascript and php validation.. one fault- return true or false goes into text box of form - Stack O

3 Answers 3

与本文相关的文章

评论列表(0)