PHP和JavaScript表单验证无效

时间:2018-02-11 22:12:43

标签: javascript php

我使用GoDaddy作为我的虚拟主机。我有一个电子邮件联系表单,我正在尝试对其进行一些验证和警报。我尝试过PHP和JavaScript都没有成功。这是我的HTML文件中的表单。

<form method="post" action="./send-email.php" id="ContactForm" name="ContactForm" onsubmit="return validateForm()" class="validate-form">
                <!-- Form inputs -->
                <div class="row">
                    <div class="form-group col-md-6 col-md-offset-3">
                      <input type="text" class="form-control ct-name" name="name" id="name" placeholder="Feature coming soon" required>
                    </div>
                    <div class="form-group col-md-6 col-md-offset-3">
                      <input type="email" class="form-control ct-mail" name="email" id="email" placeholder="Feature coming soon" required>
                    </div>
                    <div class="form-group col-md-6 col-md-offset-3">
                      <textarea class="form-control ct-message" rows="6" name="message" id="message" placeholder="Feature coming soon" required></textarea>
                    </div>
                </div>
                <!-- Button Send -->
                <div class="row">
                    <div class="form-group col-md-6 col-md-offset-3">
                        <div id="successmsg"></div>
                        <button type="submit" name="button" id="button" class="btn btnc2 with-br btn-ctc"><span>Send Now</span></button>
                    </div>
                </div>
            </form>

这是我的send-email.php文件:

<?php 
   header("Access-Control-Allow-Origin: *"); 

   $receiver="myemail@gmail.com";
   $subject="Contact Me";


  if (empty($_POST["name"])) {
    $nameErr = "Name is required";
  } else {
    $name = test_input($_POST["name"]);
    // check if name only contains letters and whitespace
    if (!preg_match("/^[a-zA-Z ]*$/",$name)) {
      $nameErr = "Only letters and white space allowed"; 
    }
  }

  if (empty($_POST["email"])) {
    $emailErr = "Email is required";
  } else {
    $email = test_input($_POST["email"]);
    // check if e-mail address is well-formed
    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
      $emailErr = "Invalid email format"; 
    }
  }

  if (empty($_POST["message"])) {
    $msg = "";
  } else {
    $msg = test_input($_POST["message"]);
  }



  function test_input($data) {
    $data = trim($data);
    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;
  }


  $message = "
  <html>
  <head>
  <title>Contact</title>
  </head>
  <body>
  <table width='50%' border='0' align='center' cellpadding='0' cellspacing='0'>
    <tr>
      <td colspan='2' align='center' valign='top'><img src='http://www.izee.ro/img/izee.png'></td>
    </tr>
    <tr>
      <td width='50%' align='right'>&nbsp;</td>
      <td align='left'>&nbsp;</td>
    </tr>
    <tr>
      <td align='right' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 5px 7px 0;'>Name:</td>
      <td align='left' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 0 7px 5px;'>".$name."</td>
    </tr>
    <tr>
      <td align='right' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 5px 7px 0;'>Email:</td>
      <td align='left' valign='top' style='border-top:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 0 7px 5px;'>".$from."</td>
    </tr>
    <tr>
      <td align='right' valign='top' style='border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 5px 7px 0;'>Message:</td>
      <td align='left' valign='top' style='border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#000; padding:7px 0 7px 5px;'>".nl2br($msg)."</td>
    </tr>
  </table>
  </body>
  </html>
  ";

  // Always set content-type when sending HTML email
  $headers = "MIME-Version: 1.0" . "\r\n";
  $headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";

  // More headers
  $headers .= 'From: <'.$from.'>' . "\r\n";


     if(mail($receiver,$subject,$message,$headers) && strlen($msg) > 0)  
     {
        echo  '<div class="alert alert-success alert-dismissable">
                <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
                <strong>The message has been sent!</strong>
              </div>';
     }
     else
     {
        echo  '<div class="alert alert-danger alert-dismissable">
                <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
                <strong>The message could not be sent!</strong> 
              </div>';
     }


  ?>

这是我尝试过的JavaScript函数:

<script>
        function validateForm() {
            var x = document.forms["ContactForm"]["name"].value;
            var y = document.forms["ContactForm"]["email"].value;
            var z = document.forms["ContactForm"]["message"].value;
            if (x == "") {
                alert("Name must be filled out.");
                return false;
            }
            if (y == "") {
                alert("Email must be filled out.");
                return false;
            }
            if (z == "") {
                alert("Message must not be blank.");
                return false;
            }
            alert("Message sent!");
            return true;
        }
    </script>

即使所有字段都留空,警报也不会显示,并且所有电子邮件都会被发送。有人可以帮助我理解错误吗?

2 个答案:

答案 0 :(得分:0)

尝试在页面加载后定义您的函数,如下所示:

<script>
    $(document).ready(function() {
       //function here
    }
</script>

答案 1 :(得分:0)

感谢大家的帮助,但我发现了这个问题。 GoDaddy在更新CSS和JavaScript方面的速度非常慢。功能终于有效了。我只是要等几个小时了。