Tableau à une seule entrée

Version imprimable

16/04/2015, 15h02
Athur

Tableau à une seule entrée

Bonjour,
Par une boucle php, je construis un tableau destiné à être récupéré par js (insertion de virgules entre chaque valeur d'un string)
Lorsque mon tableau est terminé je le récupère en js par:

Code:

echo '<script type="text/javascript"></script>';

Ce qui marche très bien, sauf quand mon tableau n'a qu'une seule valeur (index 0 seul) ce qui donne une valeur indéfinie sous js.
Pourtant l'index 0 est normalement reconnu si le tableau a au moins deux valeurs.
J'ai contourné le problème en dupliquant la valeur lorsqu'il y en a qu'une (sachant que j'ai récupéré par ailleurs le vrai nombre de valeurs).
Je ne suis donc pas bloqué, mais ça m'intéresserait de savoir si ce problème est connu.
Je suis sous Firefox 37.0.1
Merci
16/04/2015, 15h13
Bovino

Il va falloir montrer un peu plus de code si tu veux que l'on t'aide...

tableau js à une entrée

Je veux bien, mais comme je l'ai dit le problème est contourné, si dessous ma fonction php:

Code:

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
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
 
<?php
	function postmini($xprefix, $largmini, $hautmini)
	{
		//$largligne=1000; // nb pixels in line
		global $largline, $screenl, $screenh;
		$reduction=150; // si changement de nom de fichier modifier aussi le $prefixmax=str_replace('x_', '', $xprefix); plus loin
		$gap=10; // gap between 2 minis
		$nextline=$reduction+$gap; // hauteur max line + interline
		$marge=$gap/2;
		$x=$marge; $y=$nextline;		
		$n=count($largmini);
		$stringl='';
		$stringh='';
		for($i=0; $i<$n; $i++)
		{
			$large=$largmini[$i];
			$haut=$hautmini[$i];
			if($large>$haut) {$xlarge=$reduction; $xhaut=$haut*$reduction/$large;} else {$xhaut=$reduction; $xlarge=$large*$reduction/$haut;}
			$namemini=$xprefix . ($i+1) . '.jpg'; // $xprefix est le chemin des mini photos (Paris/x_Paris), $namemini est le nom complet (Paris/x_Paris10)
			$prefixmax=str_replace('x_', '', $xprefix); // on prépare le chemin pour les grandes photos (Paris/Paris)
			if($i==0) {$stringl=$stringl.$large; $stringh=$stringh.$haut;} else {$stringl=$stringl.','.$large; $stringh=$stringh.','.$haut;} // on recopie le tableau php au format js
			if(($x+$xlarge)>($largline-$marge)) // est ce que le blocmineur va encore tenir dans le blocmajeur compte tenu de de la position de x et de sa largeur
			{ // non
				?>
				</div>
				<?php
				$x=$marge; // on réinitialise x
				$y=$y+$nextline; // et on descend d'une ligne		
			}
			if($x==$marge) // test si début de ligne (cas où on vient de changer de ligne + cas initial)
			{ // on ouvre un nouveau blocmajeur ou le premier
				?>
				<div class="blocmajeur" style="height:<?php echo $nextline;?>px;">
				<?php
			}
			?>
			<!-- on range l'image à l'intérieur d'un blocmineur-->
			<div class="blocmineur" style="width:<?php echo $xlarge;?>px; height:<?php echo $nextline;?>px;">
				<div class="container" style="width:<?php echo $xlarge;?>px; height:<?php echo $xhaut;?>px; top:<?php echo $nextline-$xhaut;?>px;">
					<a href="javascript:affiche(<?php echo $i;?>, 0)"><img src="<?php echo $namemini; ?>" class="miniphoto"/>
				</div>
			</div>
			<?php
			// coordonnées suivantes:
			$x+=$xlarge+$gap; // on fait avancer l'abcisse de la largeur de l'image + un gap
		}
		?>
		</div>
		<?php
		// définition des variables globales pour js et construction des tableaux de dimensions pour js
		// Attention si le tableau n'a qu'une entrée $n=1 js ne construit pas le tableau => pour contourner le problème dans le cas où $n=1 on double l'entrée
		echo '<script type="text/javascript"><!--
			var islocked=false;
			var indexcourant=0;
			var nbre='.$n.';
			var cheminmax="'.$prefixmax.'";
			var cheminmin="'.$xprefix.'";
			if(nbre>1) {var largeurs= new Array('.$stringl.'); var hauteurs= new Array('.$stringh.');}
			else {var largeurs= new Array('.$stringl.','.$stringl.'); var hauteurs= new Array('.$stringh.','.$stringh.');}
			--></script>'; // construction du tableau pour js
		?>
		<!--</div>-->
		<?php
	}
?>

Voir commentaire: on recopie le tableau php au format js
puis à la fin dans le code js je teste s'il n'y a qu'une valeur pour la dupliquer afin de contourner le problème à noter qu'avec ce contournement tout marche très bien.
A noter encore que si dans la séquence js je rajoute un test (alert) de (availWidth) j'obtiens deux valeurs différentes
P.S. je ne sais pas pourquoi sur votre site quand je prévisualise le php s'affiche en vert comme les commentaires alors que chez moi l'affichage est correct

16/04/2015, 15h53
SylvainPV
il nous faut le code généré côté client ! (cf règles de la section)

A noter que new Array() n'est pas la bonne manière d'instancier une Array avec des éléments. Quand on passe un seul argument numérique au constructeur Array, c'est pour en indiquer la longueur, et non renseigner le premier élément:

Code:

new Array(3)--> [undefined, undefined, undefined]

La bonne manière d'instancier une Array avec ses éléments est l'écriture littérale :
Code:

1 2 var array = [3]; --> [3]

code côté client

A mon avis le code source de la page quand je la reçois (si c'est ça que vous voulez dire) ne vous donnera rien, de plus celui-ci varie en fonction des actions du client.
Voici la photo d'un instant:

Code:

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
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
		<link rel="stylesheet" href="stylephp.css" />
		<script type="text/javascript" src="fonctions.js"></script>
 
        <title>Photos</title>
    </head>
		<script language="JavaScript">
		if(screen.availWidth>=1760) document.write("<body style=\"background:url('images/egypte_filtre_1920.jpg') no-repeat;\">");
		else if(screen.availWidth>=1600) document.write("<body style=\"background:url('images/egypte_filtre_1760.jpg') no-repeat;\">");
		else if(screen.availWidth>=1440) document.write("<body style=\"background:url('images/egypte_filtre_1600.jpg') no-repeat;\">");
		else if(screen.availWidth>=1280) document.write("<body style=\"background:url('images/egypte_filtre_1440.jpg') no-repeat;\">");
		else document.write("<body style=\"background:url('images/egypte_filtre_1280.jpg') no-repeat;\">");
	</script>
    <!--<body>-->
	<div id="principale" style="opacity:1;">
		<header>
				<script language="JavaScript">
		if(screen.availWidth>=1760) document.write("<img src=\"images/album_367.png\" />");
		else if(screen.availWidth>=1600) document.write("<img src=\"images/album_336.png\" />");
		else if(screen.availWidth>=1440) document.write("<img src=\"images/album_306.png\" />");
		else if(screen.availWidth>=1280) document.write("<img src=\"images/album_275.png\" />");
		else document.write("<img src=\"images/album_245.png\" />");
	</script>
	<p class= "line1"> &copy; 2015 by R.G.</p>
			</header>
		<nav id="menu">
			    <div class="element_menu">
        <h3>Sommaire</h3>
        <ul>
            <li><a href="index.php?rtcode=21&l=1224&page=Accueil">Accueil</a></li>
            <li><a href="index.php?rtcode=21&l=1224&page=Classes">En classe</a></li>
            <li><a href="index.php?rtcode=21&l=1224&page=Paris">A Paris</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=Arles">A Arles</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=Bretagne">En Bretagne</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=LesGets">Aux Gets</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=Italie">En Italie</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=Guadeloupe">En Guadeloupe</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=Marseille">A Marseille</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=Rennes">A Rennes</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=Grece">En Grece</a></li>
			<li><a href="index.php?rtcode=21&l=1224&page=Angleterre">En Angleterre</a></li>
        </ul>
    </div>		</nav>
		<div id="droite">
					<div id="enveloppe1"></div>		</div>
	</div>
			<div id="modale1">
			<img src=# id="photo"/>
		</div>
		<div id="modale2">
			<div id="zonarrowg" onmouseover="opacifie(this)" onmouseout="eclaircie(this)">
				<div id="contarrowg">
					<a href="javascript:precedent()"><img src="images/arrowg.png" id="arrowg">
				</div>
			</div>
			<div id="zonarrowd" onmouseover="opacifie(this)" onmouseout="eclaircie(this)">
				<div id="contcroix">
					<a href="javascript:fermer()"><img src="images/croix.png" id="croix">
				</div>		
				<div id="contarrowd">
					<a href="javascript:suivant()"><img src="images/arrowd.png" id="arrowd">
				</div>
			</div>
		</div>	
	    </body>
</html>

16/04/2015, 16h19
Athur

tableau à un seul élément

Citation:

Envoyé par SylvainPV

A noter que new Array() n'est pas la bonne manière d'instancier une Array avec des éléments. Quand on passe un seul argument numérique au constructeur Array, c'est pour en indiquer la longueur, et non renseigner le premier élément:

Oui ça c'est dans les cas simples quand on connaît par avance le nombre d'éléments ce qui n'est pas le cas dans mon code. Le tableau est construit dynamiquement en fonction des actions du client. Le client consulte des fichiers d'images, chaque fichier peut contenir de 1 à n images. Lorsque le client consulte un fichier de n images le tableau js est construit dynamiquement par php avec n entrées (1 par image). S'il n'y a qu'une image dans le fichier le tableau est construit dynamiquement avec 1 entrée, le but n'était pas à l'origine de tester le cas particulier où le nombre d'image est égal à 1, ce que pourtant j'ai dû faire pour contourner le problème.
16/04/2015, 18h27
SylvainPV

C'est pour ça qu'il y a l'écriture littérale...
16/04/2015, 19h02
Athur

Toutes mes excuses, je n'avais pas bien vu la différence. En effet j'ai utilisé la notation conseillée et je n'ai plus de problème avec l'index 0.
Merci
:D