ワードプレスでajaxリクエストの結果を取得しようとしていますが、JavaScriptのアラートボックスに「0」の結果を取得しているため、フォームは次のようになります。
<form class="form" id="ajax-contact-form" action="#">
<input type="text" name="name" id="name" placeholder="Name" required="">
<button type="submit" class="btn">Submit</button>
</form>
JavaScriptは次のようになります。
$('#ajax-contact-form').submit(function(e){
$.ajax({
data: {action: 'contact_form'},
type: 'post',
url: ajaxurl,
success: function(data) {
alert(data); // This prints '0', I want this to print whatever name the user inputs in the form.
}
});
})
そしてPHP:
add_action('wp_ajax_contact_form', 'contact_form');
add_action('wp_ajax_nopriv_contact_form', 'contact_form');
function contact_form()
{
echo $_POST['name'];
}
上記のコードが正しいかどうか誰かが知っていますか?私も$ _REQUEST ['name']を試してみましたが、機能しません。
どうもありがとう、
PHP contact_form
関数に期待するname
パラメータを追加しなかったため、data
属性。
$('#ajax-contact-form').submit(function(e){
var name = $("#name").val();
$.ajax({
data: {action: 'contact_form', name:name},
type: 'post',
url: ajaxurl,
success: function(data) {
console.log(data); //should print out the name since you sent it along
}
});
});
JavaScriptにも名前の属性を追加する必要があります。
このように見えるかも........
$('#ajax-contact-form').submit(function(e){
$.ajax({
data: {action: 'contact_form', name:name},
type: 'post',
url: ajaxurl,
success: function(data) {
alert(data);
}
});
})