2017-11-24 16 views
0

私はAJAXの初心者ですから、そんなことはできません。Wordpressの特定の投稿IDにAJAXリクエストを添付するにはどうすればいいですか?

例えば、私はいくつかの機能があります。

add_action('wp_ajax_nopriv_test', 'some_fun'); 
add_action('wp_ajax_test', 'some_fun'); 

function some_fun() { 
$pt = get_the_title($post_id = 1061); 
echo $pt; 

wp_die(); 

} 

を、私のAJAX側は次のようになります。だから、

jQuery(document).ready(function($) { 

$('.bbb2').click(function() { 
$.ajax({ 
type: 'GET', 
url: ajaxurl, 
data: {action : 'test'}, 
success: function (data) { 

    $('.result_area').html(data); 
} 
}); 
}); 

}) 

、私はクラス= .bbb2でボタンを押したときに、私のAJAX要求ID = 1061の投稿のタイトルを返し、class = result_areaのDIVに表示します。

しかし、現在のID /タイトル/などを取得する場合はどうすればよいですか?私のポストの?私はこの$ post_id = 1061のように指定したくありません。代わりに$ post_idにするだけです。自分のAJAXリクエストにこのIDを強制的に表示させるにはどうすればよいですか?

私はAJAXを実装するなどのポストID、ポストタイトル、ポストメタデータとして、特定のページ上にあるボタンをクリックして、結果を得るために

+0

どのようなajax urlをお使いですか?あなたはRest APIを試していますか? www.yoursite.com//wp-json/wp/v2/posts/1061これは、特定の投稿に関するすべてを取得します。過去にデータ属性を使って探していたことをやったよ。 – Paul

答えて

0

をしたいはかなり正しい何のですこれまでここでやっている。しかし、その良いjqueryの側でナンスの検証すなわちcheck_ajax_referer();

add_action('wp_ajax_nopriv_test', 'some_fun'); 
add_action('wp_ajax_test', 'some_fun'); 

function some_fun() { 
    $post_id = filter_input(INPUT_POST, 'post_id'); 
    $pt = get_the_title($post_id); 

    wp_send_json($pt); //Use WP send json function 

    wp_die(); 
} 

を追加するために、あなたの実装はほとんど正しいですが、代わりにAjaxの機能に静的なpost_idの値を渡すのあなたは、Ajax自体からpost_idのを投稿することができます。たとえばあなたが」.bbb2" ボタンをを存在ポストからpost_idのを引き出す必要があります。このため

(ここでもこれはjqueryのにこのデータを渡す方法はたくさんあります単なる一例である)

<a href="javascript:void(0);" class="bbb2" data-postid="<?php echo get_the_id(); ?>">Click Here</a> 

上記のアンカータグで、私は "postid"としてデータを渡しました。このデータを使用してpost idを取得し、post_idをajaxに渡します。

は、以下を参照してください。

jQuery(function($) { 
    $('.bbb2').click(function() { 
    var post_id = $(this).data('postid'); //Getting post ID from anchor tag 

    //Compile the post data to retrieve 
    var postData = { 
     action: 'test', 
     post_id: post_id, 
    } 

    //Make AJAX post call (USE POST instead of GET to post data and get data in return) 
    $.post(ajaxurl, postData).done(function(result) { 
    $('.result_area').html(result); 
    }); 
    }); 
}); 

あなたは、AJAX機能にpost_idのためのアクセス権を持っているので、あなたがそのポストに任意の情報関係を抽出することができます。

私が誤解しているか、WPでajaxの呼び出しに関する質問がある場合は教えてください。

+0

こんにちは、DpEN!どうもありがとうございます。これはまさに私が必要としているようです。今すぐ試してみるよ。 –

0

私は周りに横たわっていた同様のコードから答えをまとめました。あなたのボタンの現在のページIDの値を持つデータの属性を追加します。

<button class="bbb2" data-id="<?php the_ID(); ?>"> 
    Get Post Data 
</button> 

次にクリック機能でそのIDを取得し、残りの関数に渡し:

$('.bbb2').click(function() { 
    var thisID = $(this).data('id'); 
    restPage(thisID); 
}); 

そして、ここでは魔法です残りの機能:

function restPage(id){ 

     jQuery.ajax({ 
      async: true, 
      global: false, 
      cache: false, 
      url: 'http://www.yoursite.com/wp-json/wp/v2/posts/' + id, 
      type: "GET", 
      dataType: "json", 
      header: "Content-Type: application/json", 
     }).done(function(data){ 

      //if data is returned or not 
      if (!data) { 
       alert("No Data Found"); 
      }else{ 
       var title = data.title.rendered; 
       var pageContent = data.content.rendered; 
       console.log(title); 
       console.log(pageContent); 
      }//END if (!data) 
     });//END .done() 
    }//END restPage() 

ここではコンソールにデータを記録するだけですが、あなたはこれで好きなことをすることができます。あなたが得ることができるすべてのデータを見るにはhttp://www.yoursite.com/wp-json/wp/v2/posts/1061を見てください。

+0

こんにちは、ポール。 WP Rest Apiでこのアイデアをありがとうございます。やってみます。 –

関連する問題