Using jQuery .post function in a wordpress custom template form
I'm currently whipping up a custom contact form on a wordpress site which I'm trying to submit via 开发者_如何学Cajax with jQuery, however when I perform the $.post function, firebug is reporting a 404 error in the console even though I can type the URL in to my address bar and display the page correctly. I am not posting cross-domain.
Here is an example of my code, with irrelevant code removed:
<form action="" method="post" onsubmit="return submitContactForm()" class="contactform">
<!-- inputs etc here -->
</form>
<script type="text/javascript">
function submitContactForm() {
// Omitted error checking here, return false on error
$.post('/contact'/, $('.contactform').serialize(), function(data) {
alert(data);
return false;
});
return true;
}
</script>
The post is never successful and the form submits the "normal" way every time.
I've tried many combinations in the url part of $.post including /contact/ , /contact , contact , /contact/, even the full url of the site with no luck. Has anybody had this issue before? Or am I doing something blatantly wrong? My only guess is something to do with my /%postname%/ permalink structure, other than that I'm clueless!
Any ideas/thoughts appreciated
Thanks, Andy
This is in jQuery documentation:
This is a shorthand Ajax function, which is equivalent to:
$.ajax({
type: 'POST',
url: url,
data: data,
success: success
dataType: dataType
});
Try this:
$(function()
{
$("button#send").click(function() {
$.ajax({
type: "POST",
url: "post.php",
data: $("#form").serialize(),
success: function(msg){
$("#msg_ok").html(msg);
$("#form").reset();
//alert(msg);
}
});
});
});
I finally figured out what's going on. Basically the ajax post was being performed asynchrounously, so before the response had been receieved the script continued processing
Adding async: false to a $.ajax call solved the problem
Thanks for the help
精彩评论