0
我一直在调试这种形式的最后两天，我只是无法弄清楚发生了什么事情..！变量和表单ID都似乎检查每个文件，但是当我上传它..我得到的JS文件的错误代码“对不起，'名称'，有一个问题”。无法获得JS表格的工作
任何想法？
.HTML
<div class="col-md-6 padding-none">
<div class="box-white padding-all">
<h2 class="title-border right block-mobile">Contact Headquarters</h2>
<div class="data-form">
<input type="hidden" name="qualform" id="qualform" value="Headquarters">
<form action="post" name="sentMessage" id="contactForm" novalidate>
<div class="row">
<div class="col-md-6 col-md-6 col-md-12 col-md-12">
<label>Name</label>
<div class="form-field">
<i class="fa fa-user"></i>
<input type="text" class="form-control" name="name" placeholder="Enter your name" id="name" required>
</div>
</div>
<div class="col-md-6 col-md-6 col-md-12 col-md-12">
<label>Company</label>
<div class="form-field">
<i class="fa fa-building-o"></i>
<input type="text" class="form-control" name="company" placeholder="Enter your company" id="company" required>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 col-md-6 col-md-12 col-md-12">
<label>Telephone</label>
<div class="form-field">
<i class="fa fa-phone"></i>
<input type="tel" class="form-control" name="phone" placeholder="Enter your telephone" id="phone" required>
</div>
</div>
<div class="col-md-6 col-md-6 col-md-12 col-md-12">
<label>E-Mail</label>
<div class="form-field">
<i class="fa fa-envelope-o"></i>
<input type="email" class="form-control" name="email" placeholder="Enter your email" id="email" required>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 col-md-6 col-md-12 col-md-12">
<label>Website</label>
<div class="form-field">
<i class="fa fa-globe"></i>
<input type="text" class="form-control" name="website" placeholder="Enter your website" id="website">
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12 col-xs-12 col-xs-12 col-xs-12">
<label>Message</label>
<div class="form-field">
<i class="fa fa-pencil-square-o"></i>
<textarea class="form-control" name="message" placeholder="Enter your message" id="message" required></textarea>
<div id="success"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12 col-xs-12 col-xs-12 col-xs-12">
<button type="submit" class="btn btn-dark">SEND YOUR MESSAGE</button>
</div>
</div>
</form>
</div></div>
</div>
</div>
.JS
$(function() {
$("input,textarea").jqBootstrapValidation({
preventSubmit: true,
submitError: function($form, event, errors) {
// additional error messages or events
},
submitSuccess: function($form, event) {
event.preventDefault(); // prevent default submit behaviour
// get values from FORM
var name = $(".show input#name").val();
var company = $(".show input#company").val();
var email = $(".show input#email").val();
var phone = $(".show input#phone").val();
var website = $(".show input#website").val();
var message = $(".show textarea#message").val();
var qualform = $(".show input#qualform").val();
var firstName = name;
// For Success/Failure Message
// Check for white space in name for Success/Fail message
if (firstName.indexOf(' ') >= 0) {
firstName = name.split(' ').slice(0, -1).join(' ');
}
$.ajax({
url: '../mail/contact_me.php',
type: "POST",
data: {
name: name,
company: company,
phone: phone,
email: email,
website: website,
message: message,
qualform: qualform,
},
cache: false,
success: function() {
// Success message
$('.show #success').html("<div class='alert alert-success'>");
$('.show #success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×")
.append("</button>");
$('.show #success > .alert-success')
.append(firstName + ", your e-mail was successfully sent.");
$('.show #success > .alert-success')
.append('</div>');
//clear all fields
$('.show #contactForm').trigger("reset");
},
error: function() {
// Fail message
$('.show #success').html("<div class='alert alert-danger'>");
$('.show #success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×")
.append("</button>");
$('.show #success > .alert-danger').append("<strong>Sorry, " + firstName + ", it seems like there is a problem. Please try again");
$('.show #success > .alert-danger').append('</div>');
//clear all fields
$('.show #contactForm').trigger("reset");
},
})
},
filter: function() {
return $(this).is(":visible");
},
});
$("a[data-toggle=\"tab\"]").click(function(e) {
e.preventDefault();
$(this).tab("show");
});
});
/*When clicking on Full hide fail/success boxes */
$('#name').focus(function() {
$('.show #success').html('');
});
.PHP
<?php
// sanitize
foreach ($_POST as $key => $value) {
if (ini_get('magic_quotes_gpc'))
$_POST[$key] = stripslashes($_POST[$key]);
$_POST[$key] = htmlspecialchars(strip_tags($_POST[$key]));
}
// Check for empty fields
if (empty($_POST['name']) || empty($_POST['company']) || empty($_POST['phone']) || empty($_POST['message']) || !filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)) {
echo "No arguments Provided!";
return false;
}
$name = $_POST['name'];
$company = $_POST['company'];
$email = $_POST['email'];
$phone = $_POST['phone'];
$website = $_POST['website'];
$message = $_POST['message'];
$to = '[email protected]';
$email_subject = "Contact from website website ($qualform)";
$email_body = "New form from $qualform.\n\n" . "User info:\n\nName: $name\n\nCompany: $company\n\nE-mail: $email\n\nTelephone: $phone\n\nWebsite: $website\n\nMessage: $message";
$headers = "From: Form website <[email protected]>\r\n";
mail($to, $email_subject, $email_body, $headers);
return true;
?>
谢谢！
嗨，检查，什么是由PHP脚本（contact_me.php）通过浏览器开发人员功能 - 网络选项卡返回。然后尝试为您的ajax调用设置dataType：json，可能会有所帮助 –