Postagens do filtro AJAX no clique com base na categoria

4

Esta é a minha primeira incursão no AJAX, e eu juntei pedaços de código de vários tutoriais que provavelmente não ajudaram.

Eu tenho uma lista de categorias na minha página inicial (index.php) e uma lista das postagens mais recentes. Quando um usuário clica em uma categoria, quero que essa lista de postagens seja atualizada sem atualizar a página. Atualmente, quando clico em um filtro, todas as postagens estão sendo carregadas no meu contêiner de resposta (não está filtrando por categoria) e o único conteúdo que está sendo carregado é o the_content (), embora meu modelo (listando-post.php) peça a miniatura , a categoria etc.

Estou usando o Bones como meu tema inicial, por isso o wp_localize_script está neste arquivo (está funcionando). Eu só incluí o código que eu sei que tem problemas, (eu sei que o resto do site e JS está funcionando bem).

bones.php

//Add AJAX path to use in load-posts.js
$getPath = array('ajaxURL' => admin_url('admin-ajax.php'));
wp_localize_script('main-js', 'pathToFile', $getPath);

functions.php

//AJAX Category Filter
add_action( 'wp_ajax_load_cat_posts', 'load_cat_posts' );
add_action( 'wp_ajax_nopriv_load_cat_posts', 'load_cat_posts' );

function load_cat_posts () {
    $cat_id = get_post_meta($_REQUEST['cat']);
    $args = array (
      'cat' => $cat_id,
      'posts_per_page' => 10,
      'order' => 'DESC'
    );

    $posts = get_posts($args);

    ob_start ();

    foreach ( $posts as $post ) {
      setup_postdata( $post ); ?>

      <?php get_template_part( 'partials/listing', 'post'); ?>

   <?php } wp_reset_postdata();

   $response = ob_get_contents();
   ob_end_clean();

   echo $response;
   die(1);
}

index.php

<?php $categories = get_categories(); ?>

<ul class="category-filters">
    <?php foreach ( $categories as $cat ) { ?>
        <li id="cat-<?php echo $cat->term_id; ?>">
            <a class="<?php echo $cat->slug; ?> ajax" data-cat="<?php echo $cat->term_id; ?>" href="javascript:void(0)"><?php echo $cat->name; ?></a>
        </li>
    <?php } ?>
</ul>

listing-post.php

<li class="standard-post">
    <article id="<?php echo sanitize_title_with_dashes( get_the_title() ); ?>" <?php post_class(); ?> role="article">

        <?php if (has_post_thumbnail()) { ?>
            <div class="article-image">
                <?php the_post_thumbnail(large); ?>
            </div>
        <?php } ?>

        <div class="article-left">
            <?php foreach((get_the_category()) as $category) { ?>
                <span class="article-category"><?php echo $category->cat_name . ' ';?></span>
            <?php } ?>
            </div>

            <div class="article-right">
            <header class="article-header">
                <h1 class="article-title"><?php the_title(); ?></h1>
                <p class="article-time">
                    <?php printf( __( '<time class="updated" datetime="%1$s" pubdate>%2$s</time>', 'bonestheme' ), get_the_time(), get_the_time(get_option('date_format'))); ?>
                </p>
            </header>

            <section class="entry-content">
                <?php the_content(); ?>
            </section>
        </div>

    </article>
</li>

load-posts.js

function cat_ajax_get(currentCat) {
            $('a.ajax').removeClass('current');
            $('a.ajax').addClass('current');
            $('#loading-animation').show();
            $.ajax({
                type: 'POST',
                url: ajaxurl,
                data: {action: 'load_cat_posts', cat: currentCat },
                success: function(response) {
                    $('.article-listing').html(response);
                    $('#loading-animation').hide();
                    return false;
                }
            });
        };

ajaxFilters: function() {
            $('.category-filters a').on('click', $.proxy(function(clickEvent) {
                $clickTarget = $(clickEvent.currentTarget);
                var currentCat = $clickTarget.attr('data-cat');
                cat_ajax_get(currentCat);
            },this));
        }
    
por GuerillaRadio 24.07.2014 / 16:19

1 resposta

1

Esta linha em functions.php é o seu problema:

$cat_id = get_post_meta($_REQUEST['cat']);

Acho que você está entendendo mal o objetivo da % funçãoget_post_meta() . Ele foi projetado para obter metadados para uma postagem do WordPress, não dados de uma solicitação POST para o site. O primeiro parâmetro da função get_post_meta() é o $post_id , mas como você está passando o ID da categoria, você obterá false ou uma matriz de todos os valores meta se uma postagem com o mesmo ID daquela categoria ID existe. Em qualquer um desses casos, o valor da variável cat query não será um ID categroy válido e, portanto, essa parte da consulta será ignorada e todas as postagens serão retornadas. Se você alterar essa linha para isso, isso resolverá o problema e seu código provavelmente funcionará:

$cat_id = absint( $_REQUEST['cat'] );

A absint() function apenas converte o valor fornecido pelo usuário em um inteiro positivo.

    
por J.D. 23.01.2016 / 19:30