[Résolu] Traiter une à une les images (chemins) contenus dans une bdd

Bonjour à tous

Mon but est d'afficher mes images avec jquery.jqzoom-core.js : zoom sur images en trois parties: les thumbnails, l'image sélectionnée par l'intermédiaire de son thumb puis la fenêtre zoomée.

Facile à mettre en place lorsqu'il ne s'agit que de présenter ligne à ligne la liste de mes images.

Mon problème est que ces images (leurs chemins) sont contenus dans une base de données.

Je ne sais pas si je dois numéroter ces images via la requete sql, utiliser un array row ou assoc ...

Bref, je sèche.
Nétant pas très expérimenté je ne comprends pas les rares pistes que j'ai pu glaner ça et là.
Pour finir, je m'emmêle à l'enchevétrer php et javascript

Auriez vous un indice ?
D'avance, merci

En utilisant la boucle for ?
$i=1
for($i < $i++)
...
Je ne sais pas comment intégrer ça à mon code
Le voici, le code.
Nous verrons bien

Merci de votre aide

$db = mysql_connect('bla', 'bla', 'bla');
mysql_select_db('bla',$db);
$sql = 'SELECT DISTINCT id, image, legende FROM crea ORDER BY id DESC';
$req = mysql_query($sql) or die('Erreur SQL !<br>'.$sql.'<br>'.mysql_error()); 
$i=1;
while($data = mysql_fetch_assoc($req))
{
$image=$data['image'];
$legende=$data['legende'];
}
?>
<div class="clearfix" id="content">
    <div class="clearfix">
        <a href="<?php $image++ ?>" class="jqzoom" rel='gal1'  title="blabla" >
            <img src="<?php $image++ ?>"  title="bijou"  width= "250" ;>
        </a>
    </div>
	</div>
	
<div class="clearfix" >
	<ul id="thumblist" class="clearfix" >
		<li><a class="zoomThumbActive" href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './images/diapo_01.jpg', largeimage: './images/diapo_01.jpg'}"><img src='images/diapo_01.jpg' width="50"></a></li>
		<li><a href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './images/diapo_02.jpg', largeimage: './images/diapo_02.jpg'}"><img src='images/diapo_02.jpg' width="50"></a></li>
		<li><a  href='javascript:void(0);' rel="{gallery: 'gal1', smallimage: './images/diapo_03.jpg', largeimage: './images/diapo_03.jpg'}"><img src='images/diapo_03.jpg' width="50"></a></li>
	</ul>
		</div> 
</div>
<?php
mysql_close();
	

Modifié par kaspar (25 Jun 2014 - 22:43)

Salut oui pour le wile par contre il te faut mêler ton php et html dans la boucle tu gère le passage de php a html avec les simple guillemet et l'affichage du résultat avec echo
je te post un truc calquer un chouille sur ton exemple c'est pas du 100% juste mais c'est ça dans l'esprit => tu incrémente tes image en html dans ta boucle while
remarque bien le echo au début et l'ouverture des guillemet simple juste après ....

$db = mysql_connect('bla', 'bla', 'bla');
mysql_select_db('bla',$db);
$sql = 'SELECT DISTINCT id, image, legende FROM crea ORDER BY id DESC';
$req = mysql_query($sql) or die('Erreur SQL !<br>'.$sql.'<br>'.mysql_error()); 
 <div class="clearfix" id="content">
    <div class="clearfix">
    
while($affiche = mysql_fetch_array($req))
 {
echo ' <a href="TonFichierImage/'.$affiche['image'].'" class="jqzoom" rel='gal1'  title="'.['legende'].'" >
            <img src="TonFichierImage/'.$affiche['image'].'"  title="bijou"  width= "250" ;>
        </a>';
        }
        
        </div>
        </div>

Merci Leo2v , je vais essayer ce code
Modifié par kaspar (13 Apr 2014 - 19:53)

Il y a un très net progrès :

<div class="clearfix" id="content">
				<div class="clearfix">
<?php
$db = mysql_connect('bla', 'bla', 'bla');
mysql_select_db('bla',$db);
$sql = 'SELECT DISTINCT id, image, legende FROM crea ORDER BY id DESC';
$req = mysql_query($sql) or die('Erreur SQL !<br>'.$sql.'<br>'.mysql_error()); 

while($data = mysql_fetch_array($req))
{
echo '<a href="'.$data['image'].'" class="jqzoom" rel="gal1"  title="'.$data['legende'].'">
            <img src="'.$data['image'].'"  title="bijou"  width= "250" ;>
			</a>';
}
mysql_close();
	?>
				</div>
        </div>
</div>

J'ai actuellement quatre images dans ma base de données, j'ai donc quatre jqzoom qui s'affichent.
C'est surement la partie incrémentation des images que je n'ai pas comprise.
Mais j'avance, et je t'en remercie
Je fouille du côté de l'incrémentation

oki je crois que le problème viens du fait que la je t'ai fait une boucle sur la partie grande image de ta zoumeuse et en fait il faut plutot le faire sur les vignette qui recensent toute les photos de ton truc

En effet, j'essaie de recaler tout ça...
c'est pas gagné

Merci !

ça semble fonctionner, j'ai tous mes thumbs et une seule photo, oui mais voila mes cadres sont vides !!
Voici le code :

<div class="clearfix" >
	<ul id="thumblist" class="clearfix" >
<?php
$db = mysql_connect('bla', 'bla', 'bla');
mysql_select_db('bla',$db);
$sql = 'SELECT DISTINCT id, image, legende FROM table ORDER BY id DESC';
$req = mysql_query($sql) or die('Erreur SQL !<br>'.$sql.'<br>'.mysql_error()); 

while($data = mysql_fetch_array($req))
{
echo '<a href="javascript:void(0);" rel="{gallery: "gal1", smallimage:"'.$data['image'].'", largeimage: "'.$data['image'].'"}"><img src= rel="gal1"  title="'.$data['legende'].'" width="50">
		</a>';
}
?>
</div>

<div class="clearfix" id="content">
    <div class="clearfix">
	<?php
echo '<a href="'.$data['image'].'" class="jqzoom" rel="gal1"  title="'.$data['legende'].'">
            <img src="'.$data['image'].'"  title="bijou"  width= "250" ;>
			</a>';
?>
			</div>
        </div>
<?php
mysql_close();
	?>	

...

truc 1 : -> Remplace-moi ces mysql_ que je ne saurais voir par des mysqli_ ou du PDO (en cadeau tuto en français pour le passage vers mysqli)

Truc n°2 : à quoi doit ressembler ton html pour que ça fonctionne ? Je génère rarement directement le php, je passe par le html pour savoir exactement ce que je dois créer, ensuite je fais le php en fonction.
De surcroît, avec le html, ça nous permettrait de comparer la version à laquelle ton code arrive et celle qui est sensée être là, ça nous aiderait à débugger ^^

Lothindil,

Merci pour le tuto en français sur le passage de Mysql à Mysqli que je conserve précieusement.

Je crois pouvoir affirmer que globalement, de ton aimable message, je n'ai rien compris.

Cependant je te remercie de ta contribution.
Modifié par kaspar (28 Jun 2014 - 17:14)

Je te rassure, j'ai vu pire (*ajoute à ma liste de tutoriel d'en faire un sur la structure html quand on fait mumuse avec du PHP*)

Ce que je voulais dire, ce n'est pas à quoi ressemble ton code actuellement, ni même ton code source; mais à quoi DEVRAIT ressembler ton code html pour que ça fonctionne.

Parce que chaque galerie image est différente et chacune se traite différemment au niveau du code html et php.

Il faut vraiment concevoir ton php comme créant du html. Et donc savoir à quoi doit ressembler le html permet de mieux créer le php, ou pour dire ça autrement, faire le site en fixe avant permet de le rendre dynamique plus aisément.

Parce que là, ne connaissant pas ton plug-in de galerie, je ne sais pas à quoi ton code est sensé ressembler et quel morceau fait quoi... Et donc je peux pas te dire comment faire pour que tes cadres ne soient plus vides, vu que je ne sais même pas quel cadre, ni ce qu'il doit y avoir dedans XD

Bonjour à tous
J'ai finalement obtenu le résultat souhaité.
Voici le code, qui sait, peut-il aider ?

<!DOCTYPE html PUBLIC>
<html>
    <head>
	<meta name="viewport" content="width=device-width" />
	<meta charset="utf-8" />
	<title>Le titre du site</title>

	<link rel="stylesheet" type="text/css" href="css/no.css" />
	
	<script src="js/jquery-1.6.js" type="text/javascript"></script>
	<script type="text/javascript" src="js/jquery.jqzoom-core.js"></script>
	
	<script type="text/javascript">//////Viewer d'images JQZOOM thumbs
	$(document).ready(function() {
	$('.jqzoom').jqzoom({
            zoomType: 'standard',
            lens:true,
            preloadImages: false,
            alwaysOn:false
			});
		});
</head>

<?php
$db = mysql_connect('bla, 'bla', 'bla');
mysql_select_db('bla',$db);
$sql = 'SELECT DISTINCT id, image, legende FROM table ORDER BY id DESC';
$req = mysql_query($sql) or die('Erreur SQL !<br>'.$sql.'<br>'.mysql_error()); 
while($data = mysql_fetch_array($req))
		{
	$image=$data['image'];
	$legende=$data['legende'];
	?>
	<div class="clearfix" >
	<ul id="thumblist" class="clearfix" >
		<a class="zoomThumbActive" href="javascript:void(0);" rel="{gallery: 'gal1', smallimage: '<?php echo $image;?>', largeimage: '<?php echo $image;?>'}">
		<a href="javascript:void(0);" rel="{gallery: 'gal1', smallimage: '<?php echo $image;?>', largeimage:  '<?php echo $image;?>'}">
		<img src=  '<?php echo $image;?>'  title= ' .$legende. ' width="50"></a>
			</ul>
	</div>
	<?php
		}
		?>
		<div class="clearfix" id="content">
		<div class="clearfix">
		<a href= "<?php echo $image;?>" class="jqzoom" rel="gal1"  title= '<?php echo $legende;?>'>
           <img src= " <?php echo $image;?>" title="bijou"  width= "250"></a>
		</div>
</div>';
<?php
mysql_close();
?>

Modifié par Felipe (03 Aug 2014 - 16:04)

up, faites pas attention

faites pas attention que j'ai dit :o