我正在尝试设置一个带有验证的表单。设置要求用户至少选择一个框的复选框变得相当痛苦。我已经尝试过大多数在这个论坛和其他论坛上看起来很有希望的解决方案,但无济于事。
所以我们有两个不同的复选框,它们会根据用户的选择发送到不同的电子邮件。现在,如果您在未选中复选框的情况下提交此表单,则表单只会刷新,您不会收到错误消息。所以我想从技术上讲它正在验证但用户没有收到错误消息?
代码有点乱,这是我们设置的一个测试表格,用于试验,看看我们是否可以在为客户构建真实的东西之前让它发挥作用。
顺便说一句,对 PHP 和 Javascript 非常陌生。提前致谢!
这是PHP代码...
if(isset($_POST['submit'])) {
//Check to make sure that the name field is not empty
if(trim($_POST['contactname']) == '') {
$hasError = true;
} else {
$name = trim($_POST['contactname']);
}
//Check to make sure that the subject field is not empty
if(trim($_POST['subject']) == '') {
$hasError = true;
} else {
$subject = trim($_POST['subject']);
}
//Check to make sure sure that a valid email address is submitted
if(trim($_POST['email']) == '') {
$hasError = true;
} else if (!eregi("^[A-Z0-9._%-]+@[A-Z0-9._%-]+\.[A-Z]{2,4}$", trim($_POST['email']))) {
$hasError = true;
} else {
$email = trim($_POST['email']);
}
//Check to make sure comments were entered
if(trim($_POST['message']) == '') {
$hasError = true;
} else {
if(function_exists('stripslashes')) {
$comments = stripslashes(trim($_POST['message']));
} else {
$comments = trim($_POST['message']);
}
}
if(trim($_POST['checkbox']) == '') {
$agree = filter_input(INPUT_POST, 'checkbox');
$checked = '';
if( empty($agree) )
$errors['checkbox'] = true;
else{
$checked = 'checkbox';
}
}
//If there is no error, send the email
if(!isset($hasError) && $_POST['Charlotte']) {
$emailTo = 'Charlotte@email.com'; //Put your own email address here
$body = "Name: $name \n\nEmail: $email \n\nSubject: $subject \n\nComments:\n $comments";
$headers = 'From: My Site <'.$emailTo.'>' . "\r\n" . 'Reply-To: ' . $email;
mail($emailTo, $subject, $body, $headers);
$emailSent = true;
}
//If there is no error, send the email
if(!isset($hasError) && $_POST['Mary']) {
$emailTo = 'Mary@email.com'; //Put your own email address here
$body = "Name: $name \n\nEmail: $email \n\nSubject: $subject \n\nComments:\n $comments";
$headers = 'From: My Site <'.$emailTo.'>' . "\r\n" . 'Reply-To: ' . $email;
mail($emailTo, $subject, $body, $headers);
$emailSent = true;
}
}
?>
这是Javascript...
<script type="text/javascript">
$(document).ready(function(){
// validate signup form on keyup and submit
var validator = $("#contactform").validate({
rules: {
contactname: {
required: true,
minlength: 2
},
email: {
required: true,
email: true
},
checkbox: {
required: true,
},
subject: {
minlength: 2
},
message: {
minlength: 10
}
},
messages: {
contactname: {
required: "Please enter your name",
minlength: jQuery.format("Your name needs to be at least {0} characters")
},
email: {
required: "Please enter a valid email address",
minlength: "Please enter a valid email address"
},
checkbox: {
required: "Please select at least one location"
},
subject: {
minlength: jQuery.format("Enter at least {0} characters")
},
message: {
minlength: jQuery.format("Enter at least {0} characters")
}
},
// set this class to error-labels to indicate valid fields
success: function(label) {
label.addClass("checked");
}
});
});
</script>
这是 HTML 格式的表单...
<div class="wrapper">
<div id="contactWrapper" role="form">
<h1 role="heading">Send a message</h1>
<?php if(isset($hasError)) { //If errors are found ?>
<p class="error">Please check if you've filled all the fields with valid information and try again. Thank you.</p>
<?php } ?>
<?php if(isset($emailSent) && $emailSent == true) { //If email is sent ?>
<div class="success">
<p><strong>Email Successfully Sent!</strong></p>
<p>Thank you for contacting us <strong><?php echo $name;?></strong>! Your email was successfully sent and we'll be in touch with you soon.</p>
</div>
<?php } ?>
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" id="contactform">
<div class="stage clear">
<label for="name"> Name:<em>*</em></label>
<input type="text" name="contactname" id="contactname" value="" class="required" role="input" aria-required="true" />
</div>
<div class="stage clear">
<label for="email">Email:<em>*</em></label>
<input type="text" name="email" id="email" value="" class="required email" role="input" aria-required="true" />
</div>
<div class="stage clear">
<ul>
<p>Please select a box*</p>
<li><input type='checkbox' name='Charlotte' value='1' id='checkbox' /><label for="Charlotte">Charlotte</label></li>
<li><input type='checkbox' name='Mary' value='2' id='checkbox' /><label for="Mary">Mary</label></li>
</ul>
</div>
<div class="stage clear">
<label for="subject">Subject:</label>
<input type="text" name="subject" id="subject" value="" class="required" role="input" aria-required="true" />
</div>
<div class="stage clear">
<label for="message">Message:</label>
<textarea rows="8" name="message" id="message" class="required" role="textbox" aria-required="true"></textarea>
</div>
<p class="requiredNote"><em>*</em>Denotes a required field.</p>
<input type="submit" value="Send Message" name="submit" id="submitButton" title="Click here to submit your message!" />
</form>
</div>
</div>
</div>