Comme on avait eu pas mal de misères avec Fancybox, il me semble opportun de vous montrer ici comment on peut ouvrir une popup avec jQuery vite fait 😉
Le contenu de cette popup sera alimenté par un fichier php qui retourne des données. Il s’agit ici d’un exemple simple qui vous montre le principe pour récupérer des données d’une base de données par exemple.

Il nous faut 2 fichiers. Bien sûr vous aurez pris soin d’appeler la librairie jQuery auparavant.

fichier test.html

$(document).ready(function () { // quand la page est chargée			
	$('#popup').html('chargement en cours...').show('slow'); 
        $('a.test').click(function(){ 
            $.ajax({ 
                type : 'POST', 
                url : 'test.php', 
                data: 'var=Artcompix à votre service', 
                success : function(data){ 
                    $('#loading').hide(); 
                    $('#popup').html(data); 
                }, error : function(XMLHttpRequest, textStatus, errorThrown) { 
                    $('#loading').hide(); 
                    $('#popup').html('Une erreur est survenue !'); 
                }, 
             } 
         }); 
        }); 
});

Pensez à avoir une image « loader.gif » dans votre dossier images.

Insérez ensuite un lien pour appeler la fonction jQuery.

Appel AJAX

fichier test.php

Il vous restera encore quelques détails à régler : mettre un style CSS à votre div « popup » par exemple.

Bon courage, et si ça ne fonctionne pas, les commentaires sont là.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.