how use php query in AJAX jquery

Question

Normally this script shows the title and content related to a post but I want to use custom content.php for post format.

Is there any way to use get_template_part('content'); in this script ?

<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery('.br').click(function () {
            jQuery('.contents').remove();
            var checked = jQuery('#test').serialize();

            jQuery.ajax( {

                url: "<?php echo admin_url('admin-ajax.php'); ?>",

                data: "action=call_post&" + checked,

                success: function (obj) {

                    var render_data = "<div class='contents'>";
                    // This is to watch your json object
                    console.log(obj);
                    for (var i = 0; i < obj.length; i++) {
                        console.log(obj[i].post_title);
                        render_data += " <h4>" + obj[i].post_title + "</h4>";
                        render_data += "<p>" + obj[i].post_content + "</p>";
                    }
                    render_data += "</div>";
                    jQuery(render_data).appendTo('.mobile_brand');
                }
            });
        })
    });
</script>

Function.php

add_action('wp_ajax_call_post', 'call_post');
add_action('wp_ajax_nopriv_call_post', 'call_post');
function call_post()
{
$params = wp_parse_args ( $_REQUEST, array(
  'mobile' => 'some-default-brand',
  'template' => '',

));

$brand = $params['mobile'];
$args = array(
    'post_type' => 'post',
    'meta_query' => array(
        array(
            'key' => 'brand',
            'value' => $test, 
        ) ,
    ) ,
);
$query = new WP_Query($args);
if( ! empty ($params['template'])) {
  $template = $params['template'];

    if ( $query->have_posts() ) {
   while ( $query->have_posts() ) {
  $query->the_post();
 get_template_part($template);
 }
 } 

  die();

} else {
  wp_send_json($query->posts);

}
}

content.php

    <div <?php post_class( 'col-lg-2 col-md-2 col-sm-3 col-xs-6 ' ); ?> id="post-<?php the_ID(); ?>">
                    <div class="single-post"> 

                        <div class="post-thumb" > 
                        <a href="<?php echo esc_url( post_permalink() ); ?>">
                            <?php the_post_thumbnail  ( 'large', array(
                                    'class' => 'img-responsive' 
                            ) ); ?> 
                            </a>
                        </div>  
                        <div class="post-info"> 
                            <div class="post-title">
                            <li><a href="<?php echo esc_url( post_permalink() ); ?>">
                            <?php the_title(); ?></a></li>
                            </div>
                        <div class="rs"><p><?php echo get_post_meta( get_the_ID(), 'price1', true ); ?>
        <?php _e( '', 'mobilewebsite' ); ?></p></div>
                        </div>                          
                    </div>                                 
                </div>
<?php $item_number++;
 if( $item_number % 2 == 0 ) echo '<div class="clearfix visible-xs-block"></div>';
 if( $item_number % 4 == 0 ) echo '<div class="clearfix visible-sm-block"></div>';
 if( $item_number % 6 == 0 ) echo '<div class="clearfix visible-md-block"></div>'; 
 if( $item_number % 6 == 0 ) echo '<div class="clearfix visible-md-block"></div>'; 
 ?>

Answer 1

You need to edit the PHP associated with the AJAX action call_post. If you want to return different data, you should pass a parameter in the request that you handle later;

data:"action=call_post&template=custom&"+checked,

Ideally, you could just return the data rendered from php with a flag

data:"action=call_post&template=custom&format=html&"+checked,

From a PHP perspective, you would find your parameters in $_GET, $_POST or $_REQUEST.

---

Scripts

<script type="text/javascript">
    jQuery(document).ready(function () {
        jQuery('.br').click(function () {
            jQuery('.contents').remove();
            var checked = jQuery('#test').serialize();

            jQuery.ajax( {

                url: "<?php echo admin_url('admin-ajax.php'); ?>",

                data: "action=call_post&template=content&" + checked,

                success: function (result) {

                    jQuery(result).appendTo('.mobile_brand');
                }
            });
        })
    });
</script>

functions.php

add_action('wp_ajax_call_post', 'call_post');
add_action('wp_ajax_nopriv_call_post', 'call_post');

function call_post()
{
    $params = wp_parse_args ( $_REQUEST, array(
      'mobile' = 'some-default-brand',
      'template' = '',
    ));

    $brand = $params['mobile'];

    $args = array(
        'post_type' => 'post',
        'meta_query' => array(
            array(
                'key' => 'brand',
                'value' => $brand, 
            ) ,
        ) ,
    );
    $query = new WP_Query($args);

    if( ! empty ($params['template'])) {

      $template = $params['template'];

      // loop through your query here and render the HTML using $template

      // ...

      // then kill the request

      die();

    } else {

      // or send back the posts as json

      wp_send_json($query->posts);

    }
}