如何在Wordpress中使用Ajax期间加载Visual Composer [英] How to load visual composer during using ajax in wordpress

问题描述

我在Wordpress中使用了ajax请求来获取帖子的内容，在该帖子中，我使用了Visual Composer.但是内容仅显示VC短代码，而未将其更改为真实内容..那是我使用的代码

I used an ajax request in Wordpress to get the content of a post, in that post i used the Visual Composer. but the content shows only the VC shortcodes with out changing them to the real content.. That is the code that i used

add_action( 'wp_ajax_drpk_custom','drpk_custom' );
add_action( 'wp_ajax_nopriv_drpk_custom','drpk_custom' );
function drpk_custom(){
if(isset($_REQUEST)){
    $id = $_REQUEST['id'];

    $query = new WP_Query(array('p'=>$id));
    if($query->have_posts()):
        while($query->have_posts()): $query->the_post();?>
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel"><?php the_title() ?></h4>
      </div>
      <div class="modal-body">
         <?php the_content() ?>
      </div>
        <?php endwhile;

    endif;
}
wp_die();  }

这个jQuery代码

    $('.cart-item').find('a').on('click',function(){
    var postID      = $(this).data('id'),
        ajaxContent = $('.modal-content');
        $.ajax({
            url: ajaxUrl.url,
            data: {
                'action' : 'drpk_custom',
                'id': postID
            },
            beforeSend: function(){
                // $load.fadeIn(500);
            },
            success: function(data){
                // $load.hide();
                ajaxContent.html(data);
            }
        }); 
    });

但是会返回

[vc_row][vc_column width="1/4″][vc_single_image image="389″ img_size="full" alignment="center" onclick="custom_link" img_link_target="_blank" link="#"][/vc_column][vc_column width="1/4″][vc_single_image image="390″ img_size="full" alignment="center" onclick="custom_link" img_link_target="_blank" link="#"][/vc_column][vc_column width="1/4″][vc_single_image image="391″ img_size="full" alignment="center" onclick="custom_link" img_link_target="_blank" link="#"][/vc_column][vc_column width="1/4″][vc_single_image image="392″ img_size="full" alignment="center" onclick="custom_link" img_link_target="_blank" link="#"][/vc_column][/vc_row]

推荐答案

自4.9版以来，Visual Composer添加了短码延迟加载.要在AJAX内容上使用VC短代码，请在打印内容 WPBMap :: addAllMappedShortcodes();

Since version 4.9 visual composer added shortcode lazy loading. To use VC shortcodes on AJAX content use this function before printing the content WPBMap::addAllMappedShortcodes();

add_action( 'wp_ajax_drpk_custom','drpk_custom' );
add_action( 'wp_ajax_nopriv_drpk_custom','drpk_custom' );
function drpk_custom(){
if(isset($_REQUEST)){
    $id = $_REQUEST['id'];

    $query = new WP_Query(array('p'=>$id));
    if($query->have_posts()):
        while($query->have_posts()): $query->the_post();
            WPBMap::addAllMappedShortcodes();
        ?>
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel"><?php the_title() ?></h4>
      </div>
      <div class="modal-body">
         <?php the_content() ?>
      </div>
        <?php endwhile;

    endif;
}
wp_die();  }

这篇关于如何在Wordpress中使用Ajax期间加载Visual Composer的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！