所以我试图关注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);
}
?>
知道我做错了吗?
答案 0 :(得分:1)
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
}
});
});
试试这个......