web-dev-qa-db-ja.com

Ajaxでクリックした後にショートコードを実行する方法を教えてください。

私は少し問題を抱えています、そしてあなたの助けが必要です。私は自分のページにタブがあり、一つのタブに私はグーグルマップを持っています。このタブはデフォルトでは非表示になっていて、クリックすると小さな地図しか見ることができません。それは1つのインストール済みプラグインからのショートコードです。クリック後にコンテンツを読み込むためのajaxリクエスト（ here ）を実行する方法を見つけました。単純なHTMLコードで正しく動作するように見えますが、ショートコードでphpコードを配置しようとすると動作しません。私はそれは簡単だと思いますが、私の知識は実用的なコードを書くには小さすぎます:(

<script type="text/javascript">
jQuery(document).ready(function($) {
    $('#map').on('click',function() {
        var data = {
            action: 'process_shortcode_on_tab_click'
        }
        $.post('/wp-admin/admin-ajax.php',data).done(function(response) {    
             $('#map-containter').html('<?php echo do_shortcode("[map_shortcode height='300']"); ?>');   
        });
    })
})

<div class="tabs">
<a class="tab active" href="#">Tab 1</a>
<a class="tab" href="#">Tab 2</a>
<a id="map" class="tab" href="#">Tab with map</a>

そして私のテーマ関数で私はこれを持っています：

add_action( 'wp_ajax_process_shortcode_on_tab_click_action', 'process_shortcode_on_tab_click_ajax');
add_action( 'wp_ajax_nopriv_process_shortcode_on_tab_click_action', 'process_shortcode_on_tab_click_ajax');

function process_shortcode_on_tab_click_ajax() {
echo do_shortcode('[map_shortcode height="300"]');
die();
}
shortcodeajaxgoogle-mapstabs
2
Artus2000

次のjQuery部分を置き換えるようにしてください。

 action: 'process_shortcode_on_tab_click'

これで：

 action: 'process_shortcode_on_tab_click_action'

wp_ajax_process_shortcode_on_tab_click_actionとwp_ajax_nopriv_process_shortcode_on_tab_click_actionの動作を一致させるため。

カスタムのwp_ajax_$youractionフックの名前の付け方については、例えば Codex をチェックしてください。

1
birgire