所以我试图遵循 instructions here like a recipe book我会简短地介绍一下。当我提交下面的表单时,对 http://thesite/wp-admin/member-update
的 POST 请求返回 404。据我了解,该请求应该触发我的函数 member_update ()
因为我设置了
<?php
add_action( 'wp_ajax_member-update', 'member_update' );
?>
在我的页面的开头。我不明白为什么它不起作用。其余相关代码为形式
<form method="POST" action="member-update" enctype="multipart/form-data">
<div class="modal fade" id="member-modal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<h2></h2>
</div>
</div>
</div>
<div class="modal-body">
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
Full name:
</div>
<div class="col-xs-12 col-sm-9 col-md-9 col-lg-9">
<input type="text" name="fullname" value="">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
Title:
</div>
<div class="col-xs-12 col-sm-9 col-md-9 col-lg-9">
<input type="text" name="title" value="">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
Bio (approx 150 chars):
</div>
<div class="col-xs-12 col-sm-9 col-md-9 col-lg-9">
<input type="textarea" name="bio" value="">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
Sort order:
</div>
<div class="col-xs-12 col-sm-9 col-md-9 col-lg-9">
<input type="textarea" name="sord" value="">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
Pic:
</div>
<div class="col-xs-12 col-sm-9 col-md-9 col-lg-9">
<input type="file" name="pic">
</div>
</div>
</div>
<div class="modal-footer">
<div class="row">
<div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
<!-- empty space -->
</div>
<div class="col-xs-12 col-sm-9 col-md-9 col-lg-9">
<button type="button" class="member-update-button wp-core-ui button-primary" id="remv-btn">Remove</button>
<button type="button" class="member-update-button wp-core-ui button-primary">Add</button>
</div>
</div>
</div>
<input type="hidden" name="memberAction" value="" />
</div>
</div>
</div>
</form>
以及处理表单上单击的按钮的 JS
jQuery('.member-update-button').click( function() {
var parentForm = jQuery(this).closest('form');
var formUrl = parentForm.attr('action');
var formMethod = parentForm.attr('method');
var postData = parentForm.serializeArray();
jQuery.ajax(
{
url: formUrl,
type: formMethod,
dataType: 'json',
data: postData,
success: function(retmsg)
{
alert(retmsg); // test for now
},
error: function ( )
{
alert("error"); // test for now
}
}
);
} );
以及页面底部的PHP函数
<?php
function member_update()
{
$message = '';
$message .= 'Action : ' . $_POST['memberAction'] . '. ';
$message .= 'Name: ' . $_POST['fullname'] . '. ';
$message .= 'Title: ' . $_POST['title'] . '. ';
$message .= 'Biography: ' . $_POST['bio'] . '. ';
$message .= 'Sort order: ' . $_POST['sord'] . '. ';
$targetFileName = basename($_FILES['pic']['name']);
$targetFileNameAndPath = 'assets/' . $targetFileName;
$message .= 'Target file: ' . $targetFileName . '. ';
$message .= 'Target file (with path): ' . $targetFileNameAndPath . '. ';
$thismbr = new TeamMember($_POST['fullname'], $_POST['title'], $_POST['bio'], $_POST['sord'], $targetFileName);
$thisAction = $_POST['memberAction'];
if ($thisAction == 'add')
{
$addMemberResult = $T->addMember($thismbr);
if ($addMemberResult->succeeded)
{
$message .= "Successfully added member to list\n";
if (move_uploaded_file($_FILES['pic']['tmp_name'], $targetFileNameAndPath))
{
$message .= "Successfully added " . $targetFileName . " to assets folder\n";
}
else
{
$message .= "Encountered problem when trying to add " . $targetFileName . " to assets folder\n";
}
}
else
{
$message .= "";
}
}
elseif ($thisAction == 'update')
{
// ...
}
elseif ($thisAction == 'delete')
{
// ...
}
else
{
$message .= 'Didn\'t recognize action';
}
echo json_encode($message);
}
?>
知道我做错了什么吗?
最佳答案
jQuery('.member-update-button').click( function() {
var parentForm = jQuery(this).closest('form');
var postData = parentForm.serializeArray();
jQuery.ajax({
url: "<?php echo admin_url('admin-ajax.php'); ?>",
data: {action: 'member_update', postData: postData},
type: "POST",
dataType: 'json',
success: function(retmsg)
{
alert(retmsg); // test for now
},
error: function ( )
{
alert("error"); // test for now
}
});
});
试试这个...
关于javascript - 不明白为什么我无法通过 WordPress 连接我的 AJAX 处理程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31443416/