Bonjour à tous
J'utilise jqzoom.
Le clic sur un thumbnail affiche l'image correspondante ... Les images sont classées avec d'autres infos dans une base de données.
Pour afficher mes informations complémentaires sur une autre div, j'ai besoin de connaitre l'id de la ligne contenant mes infos sur la base.
Pour ce faire, et ne connaissant pas bien Javascript, Ajax ... j'utilise un formulaire POST dans la boucle.
Le formulaire est validé simultanément à la sélection de l'image.
Mon code fonctionne partiellement : Sur ma div réception s'affiche un numéro id, mais toujours le même. L'image sélectionnée disparait au bout d'un instant, au profit de l'image par défaut.
Si je laisse le <input type="submit"/>, chaque bouton affiche un id différent, mais l'image réagit de la même façon.
Est-ce que l'envoi d'un formulaire implique forcément le chargement d'une page ?, même si la fonction "action" du formulaire est vide ou absente ?
S'agirait-il d'une tout autre chose ?
D'avance merci
Voici le code
Modifié par kaspar (01 May 2014 - 14:46)
J'utilise jqzoom.
Le clic sur un thumbnail affiche l'image correspondante ... Les images sont classées avec d'autres infos dans une base de données.
Pour afficher mes informations complémentaires sur une autre div, j'ai besoin de connaitre l'id de la ligne contenant mes infos sur la base.
Pour ce faire, et ne connaissant pas bien Javascript, Ajax ... j'utilise un formulaire POST dans la boucle.
Le formulaire est validé simultanément à la sélection de l'image.
Mon code fonctionne partiellement : Sur ma div réception s'affiche un numéro id, mais toujours le même. L'image sélectionnée disparait au bout d'un instant, au profit de l'image par défaut.
Si je laisse le <input type="submit"/>, chaque bouton affiche un id différent, mais l'image réagit de la même façon.
Est-ce que l'envoi d'un formulaire implique forcément le chargement d'une page ?, même si la fonction "action" du formulaire est vide ou absente ?
S'agirait-il d'une tout autre chose ?
D'avance merci
Voici le code
<!DOCTYPE html PUBLIC>
<html>
<head>
<meta charset="utf-8" />
<title></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>
<!-- //////////////////////////////////////////////////////////////////////////////////////// JQZOOM -->
<script type="text/javascript">
$(document).ready(function() {
$('.jqzoom').jqzoom({
zoomType: 'standard',
lens:true,
preloadImages: false,
alwaysOn:false
});
});
</script>
<!-- //////////////////////////////////////////////////////////////////////////////////////////// SUBMIT -->
<script type="text/javascript" language="javascript">
function sendForm() {
var frm;
frm = document.getElementById('idzoom');
frm.submit();
}
</script>
</head>
<body>
<div id="bloc_page">
<div id="diapzoom">
<div id="thumblist" >
<?php
$db = mysql_connect('bla', 'bla', 'bla');
mysql_select_db('bla',$db);
$sql = 'SELECT DISTINCT id, image, legende, mat, dim, pds 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))
{
$id=$data['id'];
$image=$data['image'];
$legende=$data['legende'];
?>
<form id="idzoom" name="idzoom" method="post" enctype="multipart/form-data">
<input type="hidden" name="id" value="<?php echo $id;?>">
<a class="thumb" onClick="sendForm()" href=" javascript:void(0);" rel="{gallery: 'gal1', smallimage: '<?php echo $image;?>', largeimage: '<?php echo $image;?>'}" >
<img src="<?php echo$image;?>" title="<?php echo $legende;?>" width="40" >
</a></form>
<?php
}
?>
</div>
<a id="zoom" href= "<?php echo $image;?>" class="jqzoom" rel="gal1" title= "<?php echo $legende;?>">
<img src= "<?php echo $image;?>" title="<?php echo $legende;?>" width= "300">
</a>
</div>
<div id="legende">
<?php
echo $_POST['id'];
mysql_close();
?>
</div>
</body>
</html>
Modifié par kaspar (01 May 2014 - 14:46)