web-dev-qa-db-ja.com

内部do_shortcode AJAX 折り返し電話

functions.phpファイルの中には、特定のカテゴリの投稿を表示するAJAXコールバック関数があります。

add_action( 'wp_ajax_ajaxified_function', 'ajaxified_function' );
add_action( 'wp_ajax_nopriv_ajaxified_function', 'ajaxified_function' );
function ajaxified_function() 
{ 
    $post = get_post($_POST['post_id']);
    $feat_image = get_the_post_thumbnail($post->ID);
    $desc_values = get_post_custom_values("designation",$post->ID);
    $title = current(explode(' ', get_the_title($post->ID)));
    if( is_array( $desc_values ) )
    {
     foreach($desc_values as $key => $value );
    }   
    $email_values = get_post_custom_values("email",$post->ID);
    if( is_array( $email_values ) )
    {
        foreach($email_values as $key => $email_value );
    }
    echo '<div id="bloggers_avatar">'.$feat_image.'</div>'.$post->post_.'<div id="bloggers_title">'.$post->post_title.'</div><div id="bloggers_desig">'.$value.'</div><div id="emailid" ><a class="email_link">Email '.$title.'</a></div><br/><div id="postContent">'.$post->post_content.'</div>'; 
    echo '<script>
        jQuery(document).ready(function(){
            jQuery(".email_link").colorbox({inline:true,
               width:400,
               height:600,
               fixed:true,
               href:"#email_id_meet_the_team"
           });
       });
       </script>';
       echo '<div style="display:none">
           <div id="email_id_meet_the_team">
          <div>';    
            echo do_shortcode('[contact-form-7 id="698" title="Meet The Team Email"]');

           echo '</div>
               </div>
          </div>';
      die();
  }

これを使用すると、連絡先フォームを表示する代わりに、単に echoing shortcodeが使用されます。

私は今地元で取り組んでいます。カラーボックスではなく、単に ajaxを使用するだけのデモがあります。

略歴 divに電子メールリンクがあります。そのリンクをクリックすると、私はコンタクトフォームと一緒にカラーボックスを見せたいです。

shortcodeajax
3
MidhuN

どうやって

AJAX呼び出しの代わりにスクリプトを本体に直接追加するだけでよいのであれば、はるかに良くて簡単です。

ショートコードの結果も同様です。ショートコードをwp_localize_script()内の引数として使用するだけです。

wp_localize_script( 'script-handle', 'pluginObject', array(
    'contactForm' => do_shortcode( '[contact-form-7 id="698" title="Meet The Team Email"]' ),
) );

それから - あなたのjQuery AJAXハンドラの中で、あなたがする必要があることを何でもしなさい - 例えば、連絡先フォームを挿入します。

( function( $, plugin ) {
    $.ajax( {
        url  : plugin.ajaxurl,
        data : {
            action         : plugin.action,
            _ajax_nonce    : plugin._ajax_nonce,
            data           : { 
                plugin.contactForm 
            }
        },
        beforeSend : function( d ) {
            console.log( 'Before send', d );
        }
    } )
        .done( function( response, textStatus, jqXHR ) {
            console.log( 'AJAX done', textStatus, jqXHR, jqXHR.getAllResponseHeaders() );
            // this.processAJAXResponse( response );
        } )
        .fail( function( jqXHR, textStatus, errorThrown ) {
            console.log( 'AJAX failed', jqXHR.getAllResponseHeaders(), textStatus, errorThrown );
        } )
        .then( function( jqXHR, textStatus, errorThrown ) {
            console.log( 'AJAX after finished', jqXHR, textStatus, errorThrown );
        } );
} )( jQuery, pluginObject || {} );

これで、AJAXコールバック内、およびJavaScript AJAXハンドラ内で、レンダリングされたFormにアクセスできるようになりました。

その理由

IIRCあなたの問題は、AJAXリクエストが常に公開リクエストであっても管理者リクエストであることです。管理ページにはショートコードの出力がないので、文字列の戻り値以外に何もありません。

規則：AJAX内またはAdmin要求内でショートコードを実行しないでください。

その他の注意事項：

  • AJAXコールバック内にスクリプトを追加しないでください。それは単に正しいことではありません。 wp_localize_script()を使って - 上で説明したように - 値を渡します。
  • ショートコードは通常、一部のAPIの単なるラッパーです。ショートコードを使用しないでください - 代わりにAPiを使用してください。 Stephen Harrisからの挨拶 話をしたばかりの人 - チャットの中で 私はそれをあなたに指摘すべきです。
5
kaiser