it-swarm.it

Carica più contenuti con ajax quando fai clic su più link in una vista

Ho una vista a blocchi personalizzata. Visualizzo gli ultimi 5 titoli dei nodi. Se qualcuno fa clic sul collegamento più, voglio caricare i successivi 5 titoli sotto gli attuali titoli a 5 nodi. Nessun aggiornamento della pagina e non cercapersone. È possibile? Come potrei fare per fare questo?

15
Lucy

Quindi questo è uno di quei problemi che più persone nel mondo drupal hanno cercato di risolvere.

Di recente ho tenuto una presentazione su questo stesso identico problema e su come realizzarlo con Drupal. Purtroppo non ho mai pubblicato nessuna delle mie diapositive da nessuna parte dove il resto del mondo può vedere.

Ecco la suddivisione dei moduli:

Visualizza scorrimento infinito

  • Non funziona con il supporto Ajax di Views - Si aggira attorno per fare la propria richiesta Ajax
  • Invia una richiesta a pagina intera - Questo perché non utilizza la richiesta Ajax di Views
  • Richiede Views 3.x - Questo è un vantaggio, perché il cercapersone è plug-in in 3.x

Visualizzazioni Infinite Pager

  • Support Views 2.x - Questa non è davvero una buona cosa, perché il cercapersone non è plug-in
  • Poiché funziona con 2.x, modifica in modo efficace il tema del cercapersone, le viste normali ajax e il comportamento di preelaborazione. Quindi interrompe alcune funzionalità.

E ultimo ma non meno importante è un nuovo progetto in cui ho appena aggiunto alla luce di questa domanda. Il motivo del progetto è la mia necessità di avere anche bisogno di visualizzazioni che supportino un carico maggiore, tranne le questioni sopra menzionate che non sono accettabili per il mio progetto.

Visualizzazioni carica altro

  • Richiede Views 3.x - Questo è di proposito.
  • Il supporto visualizza le normali opzioni del cercapersone, come offset, conteggio delle pagine
  • Supporta pienamente le funzionalità ajax delle viste
    • Se Ajax è abilitato nella vista, il caricamento di più aggiungerà contenuto in fondo all'elenco
    • Se ajax è disabilitato, la pagina verrà aggiornata e sostituirà il vecchio contenuto con il nuovo contenuto
    • Non esegue una richiesta a pagina intera quando esegue il callback ajax, consente alle visualizzazioni di eseguire il callback naturale e invece di sostituire il contenuto ad esso aggiunto.
  • Se stai usando il modulo waypoint la vista può essere configurata per ottenere automaticamente nuovi contenuti quando l'utente scorre fino alla fine della pagina.
  • Supporta effetti JQuery (al momento è supportato solo l'effetto dissolvenza, più presto a venire).

Spero che questo risponda alla tua domanda. Questa è la mia opinione "imparziale" ;-) su tutte le viste carica più modulo.

26
ericduran

Un altro metodo che utilizza https://github.com/paulirish/infinite-scroll in Drupal è Trasforma qualsiasi Drupal = cercapersone in un cercapersone automatico - cercapersone scroll infinito - carica più cercapersone .

Passo 1

Scarica jquery.infinitescroll.min.js da https://github.com/paulirish/infinite-scroll e inseriscilo in /sites/all/themes/YOURTHEME/js/jquery.infinitescroll.min. js.

Passo 2

Aggiungi il file JavaScript al file .info del tuo tema.

Passaggio 3

Crea un file JavaScript personalizzato /sites/all/themes/YOURTHEME/js/YOURTHEME.js contenente il seguente codice.

/**
 * Implementation of autopager @see https://github.com/paulirish/infinite-scroll
 * All views that have the "autopager" class will have an autopager
 */
Drupal.behaviors.viewsInfiniteScroll = function(context) {
  $(function(){
    var $container = $('div.autopager div.view-content');    
    $container.imagesLoaded( function(){
      $container.infinitescroll({
        navSelector  : 'div.autopager .pager',    // selector for the paged navigation
        nextSelector : 'div.autopager .pager-next a',  // selector for the NEXT link (to page 2)
        itemSelector : 'div.autopager .views-row',     // selector for all items you'll retrieve
        loading: {
          finishedMsg: 'No more pages to load.',
          img: '/sites/all/themes/YOURTHEME/images/loading.gif'
        }
      })
    })
  });
}

Passaggio 4

Aggiungi il CSS del caricatore a scorrimento infinito

#infscr-loading {
  position: fixed;
  text-align: center;
  bottom: 300px;
  left: 42%;
  z-index: 100;
  background: white;
  background: hsla( 0, 0%, 100%, 0.9 );
  padding: 20px;
  color: #222;
  font-size: 15px;
  font-weight: bold;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

Passaggio 5

Assicurati che la versione di jquery sia più recente della 1.7.1. Utilizzare uno dei metodi descritti in http://drupal.org/node/1058168 per installare una versione più recente di jQuery in Drupal.

2
Hans Rossel

Non riesco ad aggiungere un commento sulla prima risposta. Ma dovresti aggiungere il nuovo modulo: https://www.drupal.org/project/Gd_infinite_scroll Questo modulo consente di trasformare qualsiasi contenuto e cercapersone in uno scroll infinito o caricare più cercapersone.

Dalla pagina del modulo:

Fornire un'amministrazione per utilizzare il plug-in jQuery scroll infinito: auto-pager su pagine personalizzate utilizzando il pager. È possibile utilizzare il caricamento automatico sullo scorrimento o un pulsante Carica altro.

1
vincent