it-swarm.com.de

Ajax lädt doppelten Beitrag

Ich möchte mich zunächst dafür entschuldigen, dass dieser Beitrag so lang ist, aber ich glaube, dass er anderen helfen kann, da ich dieses Problem habe und dachte, ich könnte so detailliert wie möglich sein.

Ich habe ein Problem damit, dass die loop.php-Datei den gleichen Beitrag mehrmals lädt und ich habe versucht, die Methode zum Verhindern doppelter Beiträge zu verwenden, und es funktioniert nichts. Wie Sie unten sehen können, lade ich die Funktion zum Posten in die Ajax-Funktion und erhalte einen Erfolgsaufruf, aber an diesem Punkt bin ich nicht sicher, ob die Schleifendatei das Problem ist. Wenn die Site 1st lädt, lädt sie den 1. Satz von Posts und wenn sie dann den 2. Satz von Posts bekommt, ist das in Ordnung, aber alles danach ist derselbe Posts. Es wird wie die Loop-Datei geladen, aber die Abfrage bleibt hängen oder so.

Irgendwelche Vorschläge? Jede Hilfe wird sehr geschätzt.

loop.php Datei

<div class="post-left">
<?php query_posts(array('post__not_in' => $id_merge,'posts_per_page'=>'2'));
      $do_not_duplicate = $post->ID;

 if (have_posts()) : while (have_posts()) : the_post();
 if( $post->ID == $do_not_duplicate ) continue;
 $ids[] = get_the_ID(); ?>
<div class="images-grid-page-wrapper">
<?php the_title(); ?>
</div>
<?php endwhile; endif; // End the loop. Whew. ?>
</div>


<div class="post-mid">
<?php query_posts(array('post__not_in' => $id_merge,'posts_per_page'=>'3'));
      $do_not_duplicate = $post->ID;

 if (have_posts()) : while (have_posts()) : the_post();
 if( $post->ID == $do_not_duplicate ) continue;

 $ids[] = get_the_ID(); ?>
<div class="images-grid-page-wrapper">
<?php the_title(); ?>
</div>
<?php endwhile; endif; // End the loop. Whew. ?>
</div>

functions.php

add_action('wp_ajax_infinite_scroll', 'wp_infinitepaginate');           // for logged in user
add_action('wp_ajax_nopriv_infinite_scroll', 'wp_infinitepaginate');    // if user not logged in

function wp_infinitepaginate(){
    $loopFile        = $_POST['loop_file'];
    get_template_part( $loopFile );
    exit;
}

ajax

jQuery(document).ready(function($) {
    var count = 1;
    var total = <?php echo $wp_query->max_num_pages; ?>;
    $(window).scroll(function(){
            if  ($(window).scrollTop() == $(document).height() - $(window).height()){
               if (count > total){
                    return false;
               }else{
                    loadArticle(count);
               }
               count++;
            }
    }); 

    function loadArticle(){    
            $('a#inifiniteLoader').show('fast');
            $.ajax({
                url: "<?php bloginfo('wpurl') ?>/wp-admin/admin-ajax.php",
                type:'POST',
                data: "action=infinite_scroll&loop_file=loop", 
                success: function(html){
                    $('a#inifiniteLoader').hide('1000');
                    $("#content").append(html);    // This will be the div where our content will be loaded
                }
            });
        return false;
    }
});
1
Jeremy Love

Sie haben hier ein paar Dinge zu beachten.

Beginnen wir mit dem Browser.

Sie bauen das HTML auf, soweit es gut ist, und enthalten die Struktur und alles für Ihre Site. Es werden keine Artikel angezeigt.

Der nächste Schritt, den Ihr Browser ausführen muss, ist der Aufruf von AJAX.

Hier sind die ersten Dinge zu beachten. In Ihrer document.ready-Funktion senden Sie den Versatz von Posts nicht an Ihre AJAX-php-Funktion. Soweit ich aus Ihrem Code ersehen kann, möchten Sie beim Aufruf der Funktion immer 5 Beiträge anzeigen.

Betrachten Sie daher Folgendes:

Zunächst ist die Anzahl 0. Mit jedem erfolgreichen Neuladen erhöht sich die Anzahl um 5. Sie sollten diesen Teil in den Erfolgsteil Ihres AJAX -Aufrufs einfügen. Außerdem muss Ihre AJAX-PHP-Funktion den Versatz der zu liefernden Posts kennen.

Eine andere zu berücksichtigende Sache ist, dass Sie möglicherweise eine andere Abfrage auf Ihrer Site haben als die in Ihrer AJAX-Funktion. Stellen Sie also sicher, dass der var total die richtige Nummer ist, aber ich werde jetzt nicht weiter darauf eingehen und ihn so lassen, wie Sie ihn hatten. Du hast die Idee.

Dein Javascript sollte so aussehen:

jQuery(document).ready(function($) {
    var count = 0;
    var total = <?php echo $wp_query->max_num_pages; ?>;
    $(window).scroll(function(){
            if ($(window).scrollTop() == $(document).height() - $(window).height()){
               if (count > total){
                    return false;
               }else{
                    loadArticle(count);
               }
            }
    }); 

    function loadArticle(count){    
            $('a#inifiniteLoader').show('fast');
            // I prefer doing the ajaxdata with an array
            var ajaxdata = { 
               'action' : 'infinite_scroll'
               'offset' : count
            }
            $.ajax({
                url: "<?php bloginfo('wpurl') ?>/wp-admin/admin-ajax.php",
                type:'POST',
                data: ajaxdata, 
                success: function(html){
                    $('a#inifiniteLoader').hide('1000');
                    $("#content").append(html);    // This will be the div where our content will be loaded
                        count = count + 5; // Increase the number of posts that are already shown.
                }
            });
        return false;
    }
});

Wie Sie sehen, habe ich ein Array für die Ajax-Daten erstellt. Es ist einfacher, es auf diese Weise zu betrachten. Ich habe auch den loopfile=loop entfernt, wie Sie später sehen können, da ich die Antwort auf eine andere Weise ausführen würde.

So weit so gut - jetzt sollten wir uns überlegen, Ihre AJAX Antwort ein wenig anders zu gestalten. Sie haben es richtig registriert, aber ich würde es nicht mit dem get_template_part behandeln, eine andere Funktion ausführen und die Variablen übergeben.

Die Registrierung der AJAX -Funktion würde folgendermaßen aussehen:

add_action('wp_ajax_infinite_scroll', 'wp_infinitepaginate');           // for logged in user
add_action('wp_ajax_nopriv_infinite_scroll', 'wp_infinitepaginate');    // if user not logged in

function wp_infinitepaginate(){
    load_ajax_results($_POST['count']);
    exit;
}

Der letzte Schritt ist die eigentliche Funktion, um Ihre Ausgabe zusammenzustellen. Sie können dieses überall platzieren, Ihren functions.php oder eine andere Datei. Ich ziehe es vor, eine Datei ajax-functions.php zu erstellen, die in meinem functions.php enthalten ist und alle oben genannten Funktionen enthält (außer natürlich Javascript).

<?php

    function load_ajax_results( $offset ) {
    // I use the $_POST['count'] as $offset here
?>

    <div class="post-left">
    <?php
        $args = array(
            'numberposts' => '2', // 2 Posts to show here
            'offset'      => $offset // the number of Posts to skip, given by the AJAX call
        );
        query_posts( $args ); // nothing else should be needed

        if (have_posts()) : while (have_posts()) : the_post();
        ?>
            <div class="images-grid-page-wrapper">
                <?php the_title(); ?>
            </div>
        <?php endwhile; endif; // End the loop. Whew. ?>
        <?php wp_reset_query(); // reset it ?>
    </div>


    <div class="post-mid">
    <?php 
        $offset = $offset + 2; // because we had 2 Posts before
        $args = array(
            'numberposts' => '3', // 3 Posts to show here
            'offset'      => $offset // the number of Posts to skip, given by the AJAX call
        );
        query_posts( $args ); // nothing else should be needed

        if (have_posts()) : while (have_posts()) : the_post();
        ?>
            <div class="images-grid-page-wrapper">
                <?php the_title(); ?>
            </div>
        <?php endwhile; endif; // End the loop. Whew. ?>
    </div>

<?php

    }

?>

Da ich hier den Versatz verwende, muss ich nicht prüfen, ob einer der Posts bereits angezeigt wurde.

Das Hauptproblem, das Sie hatten, ist, dass Sie einen Fehler beim Nachdenken über die Funktion AJAX hatten. Diese Funktion weiß nichts darüber, was im Browser vor sich geht. Sie müssen also angeben, welche Beiträge angezeigt werden sollen. Es ist jedes Mal eine neue Instanz, wenn es aufgerufen wird. Daher werden die Werte, deren Posts das letzte Mal zugestellt wurden, nicht gespeichert.

Ich habe dies nicht an meiner Installation getestet, aber ich hoffe, Sie haben die Idee dahinter. Wenn es irgendwelche Fehler gibt, sorry und wenn es irgendwelche Fragen gibt, bitte kommentieren :)

1
fischi