• Resolved uhorcik

    (@uhorcik)


    Hi! Im using an Ajax callback function to filter the list of displayed posts under which i got your Load More button. When i filter the results the button gets hidden and even when i rewrite “visibility: hidden” to “visibility: visible” it appears but does not work – is not clickable at all.
    Do you have any clue why this can be happening?

    My shortcode:

    
    [ajax_load_more container_type="div" post_type="'.$post_type.'" taxonomy="'.$taxonomy.'" taxonomy_terms="'.$category.'" taxonomy_operator="IN" posts_per_page="'.$posts_per_page.'" pause="true" scroll="false" transition_container="false" button_label="Show More" offset="'.$posts_per_page.'" orderby="menu_order"]
    
    • This topic was modified 5 years, 10 months ago by uhorcik.
Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Darren Cooney

    (@dcooney)

    @uhorcik Im not quite following what youre attempting to do… Are you using the Filter method?
    https://connekthq.com/plugins/ajax-load-more/docs/public-functions/#filter

    Thread Starter uhorcik

    (@uhorcik)

    @dcooney nope, sorry for not being specific. I have a separate AJAX callback function that refreshes the container with displayed post links whenever the dropdown filter changes its value. This container also contains “Load More” button generated by your plugin. This button hides and stops functioning when i change the filter value and the AJAX call of my filter function is called. Please see my callback function:

    
    <?php
    add_action( 'wp_ajax_nopriv_filter', 'filter_ajax' );
    add_action( 'wp_ajax_filter', 'filter_ajax' );
    
    function filter_ajax() {
    
        $category = $_POST['category'];
    
        $post_type = 'my_post_type';
        $taxonomy = 'my_taxonomy';
    
        $posts_per_page = '10';
        $args = array(
            'post_type'   => $post_type,
            'post_status' => 'publish',
            'posts_per_page'=> $posts_per_page
        );
    
        if(isset($category) && $category !== "") {
            $args['tax_query'] = array(array ('taxonomy' => $taxonomy, 'field' => 'slug', 'terms' => $category,));
        }
    
        $articles = new WP_Query( $args );
        if( $articles->have_posts() ) :
            ?>
    
            <div class="columns">
                <?php
                while( $articles->have_posts() ) :
                    $articles->the_post();
                    ?>
    
                    <div class="article-box column">
    
                        <a href="<?php echo get_the_permalink() ?>">
                            <div class="box">
    
                                <h4>
                                    <?php
                                    $categories = get_the_terms($post, $taxonomy);
                                    if (!empty($categories)) {
                                        echo esc_html($categories[0]->name);
                                    }
                                    ?>
                                </h4>
                                <p><?php echo get_the_title() ?></p>
                            </div>
                        </a>
                    </div>
    
                <?php
                endwhile;
                echo do_shortcode('[ajax_load_more container_type="div" post_type="'.$post_type.'" taxonomy="'.$taxonomy.'" taxonomy_terms="'.$category.'" taxonomy_operator="IN" posts_per_page="'.$posts_per_page.'" pause="true" scroll="false" transition_container="false" button_label="Show More" offset="'.$posts_per_page.'" orderby="menu_order"]');
                ?>
            </div>
        <?php
        else :
            esc_html_e( 'No Articles found!', 'text-domain' );
        endif;
        wp_reset_postdata();
        die();
    }
    
    

    Please note that im a total noob in ajax and this is my first ever callback function

    Plugin Author Darren Cooney

    (@dcooney)

    Hi @uhorcik
    Ok, got it. The issue here is (most likely) you need to tell Ajax Load More to start.

    To do this, in your JavaScript file, after a success Ajax call trigger ALM.

    var el = document.querySelector('.ajax-load-more-wrap'); 
    ajaxloadmore.start(el);

    Note, you need to make sure you call this after your Ajax call was successful and the content is loaded.

    Here is an example of loading Ajax Load More with Ajax. Thisis where the code is from.
    https://connekthq.com/plugins/ajax-load-more/docs/code-samples/loading-via-ajax/

    Hope this helps.

    Thread Starter uhorcik

    (@uhorcik)

    It did the magic, thanks a million!:)

    Plugin Author Darren Cooney

    (@dcooney)

    Ok great! Thanks for following up 🙂

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Load More button inside ajax callback function’ is closed to new replies.