Question

当我提交表单时，我得到了我的javascript验证消息，这些消息是正确的，但表单仍然提交，我得到了php验证消息。如果javascript测试通过，我怎么才能提交我的表格：

形式：

enter code here// first name is mandatory
if (!$firstName) {
$msg_to_user = '<h4 class="errmsg"><font color="FF0000">Please enter your first name.</font></h4>';

// email is mandatory
} else if (!$email) {
$msg_to_user = '<h4 class="errmsg"><font color="FF0000">Please type an email address ' . $firstName . '.</font></h4>';

// check email is valid
} else if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$msg_to_user = '<h4 class="errmsg"><font color="FF0000">' . $email . ' is not a valid email address.</font></h4>';

// check postcode is a number
} else if (!empty($postcode) && !is_numeric($postcode))  {  
$msg_to_user = '<h4 class="errmsg"><font color="FF0000">Postcode must be a numeric value.</font></h4>';

// check postcode is greater than 4 chars
} else if (!empty($postcode) && (strlen ($postcode) < 4)) {
$msg_to_user = '<h4 class="errmsg"><font color="FF0000">Postcode must be at least 4 characters.</font></h4>';

// check postcode is less than 12 chars
} else if (strlen ($postcode) > 12) {
$msg_to_user = '<h4 class="errmsg"><font color="FF0000">Postcode must be less than 12 characters.</font></h4>';

// check email doesn't exist    
} else if ($numRows > 0) {
$msg_to_user = '<h4 class="errmsg"><font color="FF0000">' . $email . ' is already in the system.</font></h4>';

// if all test passed, insert details into database
} else {
$sql_insert = mysql_query("INSERT INTO newsletter (firstName, lastName, email, postcode, dateTime) 
                                                VALUES('$firstName','$lastName','$email','$postcode',now() )") or die(mysql_error());

$subscribed = '<h4 class="submsg"><font color="0066FF">Thanks ' . $firstName . ' ' . $lastName . ', ' . $email . '  has been subscribed to our newsletter.</font></h4>';
?>



<form name="newsletter" method="post" action="<?php echo $_SERVER['PHP_SELF'];" ?>    
id="newsletter" onSubmit="postcodeval(); emailval(); notnull();">
<fieldset>
  <label for="firstName" id="firstName_label">First Name*:</label>
  <input type="text" name="firstName" id="firstName" size="36" value="<?php echo isset($firstName) ? $firstName : '' ?>" class="text-input" onBlur="notnull()" />
  <br />
  <label for="lastName" id="lastName_label">Last Name:</label>
  <input type="text" name="lastName" id="lastName" size="36" value="<?php echo isset($lastName) ? $lastName : '' ?>" class="text-input" />
  <br />
  <label for="email" id="email_label">Email*:</label>
  <input type="text" name="email" id="email" size="36" value="<?php if (isset($_POST['submit_newsletter'])){echo $_SESSION['newsletterSignup'];} ?><?php echo isset($email) ? $email : '' ?>" class="text-input" onBlur="emailval()" />
  <br />
  <label for="postcode" id="postcode_label">Postcode:</label>
  <input type="text" name="postcode" id="postcode" size="12" value="<?php echo isset($postcode) ? $postcode : '' ?>" class="text-input" onBlur="postcodeval()" />
    <br />
  <input type="submit" name="submit" id="submit_btn" value="Subscribe" />
</fieldset>

使用Javascript：

    //Name cannot be blank
function notnull() {
var z = document.forms["newsletter"]["firstName"].value;
if (z === null || z === "") {
    inlineMsg('firstName', 'You must enter your name.', 3);
    return false;
}
}


//Vaidate email address
function emailval() {
var y = document.forms["newsletter"]["email"].value;
var atpos = y.indexOf("@");
var dotpos = y.lastIndexOf(".");
if (y === null || y === "") {
 inlineMsg('email', 'You must enter an email.', 3);
}       
if (y === null || y === "") {
    return true;
}
if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= y.length) {
    inlineMsg('email', 'Not a valid e-mail address.', 3);
    return false;
}
}


//Vaidate postcode
function postcodeval() {
var x = document.forms["newsletter"]["postcode"].value;
if(!!x){
    if (isNaN(x)) {
 inlineMsg('postcode', 'Must be numbers only.', 3);
}   

else if (x.length < 4) {
 inlineMsg('postcode', 'Must be more than than 4 characters.', 3);
}   

 else if (x.length > 12) {
 inlineMsg('postcode', 'Must be less than 12 characters.', 3);
}

}else{
}
}

Answer 1

在表单onSubmit中，你必须在函数调用中使用return。

<form name="newsletter" method="post" action="<?php echo $_SERVER['PHP_SELF'];" ?>    
id="newsletter" onSubmit=" return postcodeval(); return emailval(); return notnull();">

Answer 2

在控制台中查找错误。您的验证需要在提交时运行，如果有效则返回true，否则返回false。实际脚本中的任何错误都将允许提交

例如

<form onsubmit="return validate(this)" ...>

验证在哪里

function validate(theForm) {
  return nameval(theForm) &&
         emailval(theForm) &&
         postcodeval(theForm);
}

//Name cannot be blank
function nameval(theForm) {
  var name = theForm["firstName"].value;
  if (name === "") { // cannot be null
    inlineMsg('firstName', 'You must enter your name.', 3);
    return false;
  }
  return true;
}


//Vaidate email address
function emailval(theForm) {
  var email = theForm["email"].value;
  if (email === "") {
   inlineMsg('email', 'You must enter an email.', 3);
   return false;
  }       
  var atpos = email.indexOf("@");
  var dotpos = email.lastIndexOf(".");
  if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= y.length) {
    inlineMsg('email', 'Not a valid e-mail address.', 3);
    return false;
  }
  return true;
}


//Vaidate postcode
function postcodeval(theForm) {
  var postCode = theForm["postcode"].value;
  if(postCode !=="") { // postcode is not mandatory
    if (isNaN(postCode)) {
      inlineMsg('postcode', 'Must be numbers only.', 3);
      return false;
    }   
    if (postCode.length < 4) {
      inlineMsg('postcode', 'Must be more than than 4 characters.', 3);
      return false;
    }   
    if (postCode.length > 12) {
      inlineMsg('postcode', 'Must be less than 12 characters.', 3);
      return false;
    }
  }
  return true;
}

一旦javascript验证成功，就提交PHP表单

2 个答案: