sql >> Databasteknik >  >> RDS >> Mysql

Ladda ajax-innehåll dynamiskt på fancybox från MySQL-databasen

Vad du kan göra är att hämta de kommande (relaterade) objekten från din databas och lagra dem i en json variabel som :

var databaseResponse = [{
    href: "path/image05.jpg", // 4 are visible on page so
    type: "image",
    title: "Image #5",
    isDom: false
}, {
    href: "path/image06.jpg",
    type: "image",
    title: "Image #6",
    isDom: false
}, {
    href: "path/image07.jpg",
    type: "image",
    title: "Image #7",
    isDom: false
}]; // etc

Sedan push objekten från den variabeln till galleriet i beforeLoad återuppringning som :

var done = false; // initialize switch
jQuery(document).ready(function ($) {
    $(".fancybox").fancybox({
        // loop : false, // optional
        beforeLoad: function () {
            // here get next items from database 
            // and store them in a json variable
            // e.g. "databaseResponse"
            if ((this.index == this.group.length - 1) && !done) {
                for (var i = 0; i < databaseResponse.length; i++) {
                    this.group.push(databaseResponse[i]);
                };
                done = true; // push items only once
            }
        },
        afterClose: function () {
            done = false; // reset switch
        }
    });
}); // ready

Meddelande att vi använder en switch (den done variabel) för att skjuta objekten endast en gång (vi kan behöva återställa switchen efter att ha stängt fancybox dock)

JSFIDDLE

OBS :objekten kommer att läggas till (pushas) först efter att vi ser det sista objektet i DOM (den 4:e i ditt fall) så om du börjar bläddra bakåt i galleriet kommer du inte att se de nya objekten utan tills den andra slingan.

Du kanske vill ställa in loop till false dock




  1. ORA-06508:PL/SQL:kunde inte hitta den programenhet som anropas

  2. Problem med int(11) datatype i MYSQL

  3. Dynamiskt radspann vid hämtning av poster från databasen

  4. Räkna ordförekomster i en tabellkolumn