1
我想讓我的聯繫表單提交使用ajax保存在WordPress數據庫中。但是,儘管出現成功消息 - 它不保存在數據庫中。在我必須修改我的腳本以進行驗證工作之前,它已經保存到數據庫中,並且只有在所有字段都正確填寫後才提交表單。使用ajax提交表單提交到WordPress數據庫
我已經在下面包含了我的代碼。
感謝您提前提供任何幫助。
表
<form name="message" id="message" class="contactusform" enctype="multipart/form-data" action="<?=admin_url()?>admin-post.php">
<?php
if(isset($_SESSION["message"]))
{
echo $_SESSION["message"];
unset($_SESSION["message"]);
}
?>
<input type="hidden" name="action" value="add_foobar">
<input type="hidden" name="data" value="foobarid">
<label>Full Name:</label>
<input type="text" name="name" value="" required="">
<label>Phone Number:</label>
<input type="text" name="telno" id="telno">
<label>Email Address:</label>
<input type="email" name="email" value="" required="">
<label>Town:</label>
<input type="text" name="town" value="" required="">
<label>Device:</label>
<select name="device" value="" required="">
<option selected="selected" value=""></option>
<option value="Not Sure">Not Sure</option>
<option selected="selected" value=""></option>
<option value="iPhone 3G">iPhone 3G</option>
<option value="iPhone 3GS">iPhone 3GS</option>
<option value="iPhone 4G">iPhone 4G</option>
<option value="iPhone 4S">iPhone 4S</option>
<option value="iPhone 5">iPhone 5</option>
<option value="iPhone 5C">iPhone 5C</option>
<option value="iPhone 5S">iPhone 5S</option>
<option value="iPhone 6">iPhone 6</option>
<option value="iPhone 6 Plus">iPhone 6 Plus</option>
<option selected="selected" value=""></option>
<option value="MacBook">MacBook</option>
<option value="MacBook Pro">MacBook Pro</option>
<option value="MacBook Air">MacBook Air</option>
<option selected="selected" value=""></option>
<option value="iMac">iMac</option>
<option selected="selected" value=""></option>
<option value="iPad 1">iPad 1</option>
<option value="iPad 2">iPad 2</option>
<option value="iPad 3">iPad 3</option>
<option value="iPad 4">iPad 4</option>
<option value="iPad Air">iPad Air</option>
<option value="iPad Air 2">iPad Air 2</option>
<option value="iPad Mini 1">iPad Mini 1</option>
<option value="iPad Mini 2">iPad Mini 2</option>
<option value="iPad Mini 3">iPad Mini 3</option>
<option selected="selected" value=""></option>
<option value="iPod Classic">iPod Classic</option>
<option value="iPod Mini">iPod Mini</option>
<option value="iPod Nano">iPod Nano</option>
<option value="iPod Shuffle">iPod Shuffle</option>
<option value="iPod Touch">iPod Touch</option>
</select>
<label>Message:</label>
<textarea name="message" cols="30" rows="4" value="" required=""></textarea>
<input class="submit2" type='submit' id='submit' value='Send Message' />
</form>
<div id='simple-msg'></div>
腳本
<script type="text/javascript">
$(document).ready(function() {
$('.contactusform').validate({
rules: {
name: {
required: true
},
telno: {
required: true,
number: true
},
email: {
required: true,
email: true
},
town: {
required: true
},
device: {
required: true
},
message: {
required: true
},
},
messages: {
name: {
required: "Please enter your full name."
},
telno: {
required: "Please enter your phone number."
},
email: {
required: "Please enter your email address."
},
town: {
required: "Please enter your town."
},
device: {
required: "Please select your device."
},
message: {
required: "Please enter your message."
},
},
submitHandler: function (form) {
$("#simple-msg").html("Sending...");
var postData = $(this).serializeArray();
var formURL = $(this).attr("action");
$.ajax({
type: "POST",
url: formURL,
data: postData,
success:function(data, textStatus, jqXHR) {
$("#simple-msg").html('<p>Thanks for your request - we will be in touch soon!</p>');
},
error: function(jqXHR, textStatus, errorThrown) {
$("#simple-msg").html('<p>Message failed to send. Please try again!</p>');
}
});
}
});
});
</script>