Passer variable php à javascript

**philippef** · 23/11/2010, 15h30

Bonjour,

j'ai plusieurs photos sur une page vignettes.php. Sur cette page on peut soit lancer un diaporama ou cliquer sur une photo pour la voir en plus grand.
Si on clique sur une photo je récupère le numéro de la photo dans une variable php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
//$numero correspond au numéro de la photo à afficher dans le fichier "contenant.php"
$numero= 0;
?>
<p>
Cliquez sur une photo pour une vue agrandie.
<br /> afficher le <a href="index.php?page=contenant_2005">diaporama</a>
</p>
<a href="index.php?page=contenant_2005&&amp;numero=<?php $numero=1; echo $numero;?>"><img name="image" src="i_albums/album_2005/images2005/petites/1.jpg" /></a>
<a href="index.php?page=contenant_2005&&amp;numero=<?php $numero=2; echo $numero;?>"><img name="image" src="i_albums/album_2005/images2005/petites/2.jpg"></a>
<a href="index.php?page=contenant_2005&&amp;numero=<?php $numero=3; echo $numero;?>"><img name="image" src="i_albums/album_2005/images2005/petites/3.jpg" /></a>
....
<br />
<input type="hidden" name="image" value="<?php echo $numero;?>">

le contenu du fichier contenant.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<div style="width:800px;">
<p align=center>
<a href="index.php?page=album_2005">Retour vignettes</a>
</p>
<form name="slideform"> 
<table border=0 align="center" cellspacing="1" cellpadding="4" bgcolor="#000000">
	<tr> 
		<td align=center bgcolor="#C0C0C0"> 
			<input type=button onClick="first();" value="|<<" title="Beginning"> 
			<input type=button onClick="previous();" value="<<" title="Previous"> 
			<input type=button name="slidebutton" onClick="ap(this.value);" value="Start" title="AutoPlay"> 
			<input type=button onClick="next();" value=">>" title="Next"> 
			<input type=button onClick="last();" value=">>|" title="End"> 
		</td> 
	</tr>
	<tr> 
		<td align=center bgcolor="#C0C0C0"> 
			<select name="slide" onChange="change();"> 
			<option value="i_albums/album_2005/images2005/grandes/1.jpg" selected>Route Givrée - Empeaux le 23/01/2005 
			<option value="i_albums/album_2005/images2005/grandes/2.jpg">Route Givrée - Empeaux le 23/01/2005 Les Amis Randonneurs Braxéens 
			<option value="i_albums/album_2005/images2005/grandes/3.jpg">Concentration Hivernale - Domaine le Ribonnet le 06/02/2005
			<option value="i_albums/album_2005/images2005/grandes/4.jpg">Concentration Hivernale - Domaine le Ribonnet le 06/02/2005 
....
			</select> 
		</td> 
	</tr>  
	<tr> 
		<td align=center bgcolor="white" width="200px" height="250px">
		<?php
                        //numero correspond au numéro de la photo qui a été sélectionnée sur la page "vignettes.php"
                        if (isset($_GET["numero"])){
                                $numero= $_GET["numero"];
                        } 
                        else {
                                $numero = 1;
                        }
                        $image= $numero.".jpg"; 
                ?>
		<img src="i_albums/album_2005/images2005/grandes/<?php echo $image;?>" name="show" />
		</td> 
	</tr> 
</table> 
</form>
</div>

Donc quand je clique sur une petite photo le fichier contenant s'ouvre et la photo en grand apparait bien.

Le problème c'est quand je clique sur photo suivante ou photo précédente,
la 2ème photo qui s'affiche.

le code javascript du diaporama

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
 
var rotate_delay = 2500;
current = 0;
 
function next() { 
	if (document.slideform.slide[current+1]) { 
		document.images.show.src = document.slideform.slide[current+1].value; 
		document.slideform.slide.selectedIndex = ++current; 
   	} 
	else first(); 
	} 
function previous() { 
	if (current-1 >= 0) { 
		document.images.show.src = document.slideform.slide[current-1].value; 
		document.slideform.slide.selectedIndex = --current; 
   	} 
	else last(); 
} 
function first() { 
	current = 0; 
	document.images.show.src = document.slideform.slide[0].value; 
	document.slideform.slide.selectedIndex = 0; 
} 
function last() { 
	current = document.slideform.slide.length-1; 
	document.images.show.src = document.slideform.slide[current].value; 
	document.slideform.slide.selectedIndex = current; 
} 
function ap(text) { 
	document.slideform.slidebutton.value = (text == "Stop") ? "Start" : "Stop"; 
	rotate(); 
} 
function change() { 
	current = document.slideform.slide.selectedIndex; 
	document.images.show.src = document.slideform.slide[current].value; 
} 
function rotate() { 
	if (document.slideform.slidebutton.value == "Stop") { 
		current = (current == document.slideform.slide.length-1) ? 0 : current+1; 
		document.images.show.src = document.slideform.slide[current].value; 
		document.slideform.slide.selectedIndex = current; 
		window.setTimeout("rotate()", rotate_delay); 
   	} 
} 
//  End -->

Il faudrait que je passe la variable php $numero à la variable javascript current.
Il faut aussi que je teste si la variable $numero est vide au quel cas je conserve current = 0

J'espère que j'ai été clair et quelqu'un pourra m'aider

Merci d'avance

**SpaceFrog** · 23/11/2010, 15h34

c'est curieux ça ...
tu arrives à le mettre dans une value d'input, mais pas dans une variable ?

**philippef** · 23/11/2010, 16h01

Ben je ne sais pas trop où l'affecter à la variable javascript

et je ne vois pas non plus comment faire le test.

**SpaceFrog** · 23/11/2010, 16h02

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

current = <?php echo .... ?> ;

**philippef** · 23/11/2010, 17h09

Dans le fichier contenant.php j'ai ajouté :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
if (!empty($_GET["numero"])){ 
	$numero = $_GET["numero"];
}
else {
	$numero= 0;
}
?>

dans le fichier javascript

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

current = <?php echo $_GET["numero"];?>;

Quand je clique sur n'importe quel bouton du diaporama, rien ne se passe!!

**SpaceFrog** · 23/11/2010, 17h11

isset ... pas isempty

**philippef** · 23/11/2010, 18h23

J'avais déjà eassayé isset mais ça marchait pas non plus!!

**Bovino** · 23/11/2010, 20h42

dans le fichier javascript

Bah non, c'est pas dans le fichier JavaScript qu'il faut mettre du PHP

C'est dans le fichier PHP, dans le head par exemple :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<script type="text/javascript">
$numero = (isset($_GET["numero"]) && is_numeric($_GET["numero"])) ? $_GET["numero"] : 0;
echo 'var current ='.$numero;
</script>

**SpaceFrog** · 24/11/2010, 08h22

sauf si le fichier js a une extension php et que tu renvoie un header js ou que ton serveur interprète aussi les .js ...

Passer variable php à javascript

JavaScript

Discussions similaires

Partager

Partager