Partage

Console qui retourne "NaN"

Sujet résolu

4 août 2021 à 3:22:33

Bonsoir,

j'ai essayé de transférer une variable PHP ( qui a pour valeur soit 1 soit 0 ) en JS toutefois la console ne l'interprète pas comme je le voudrais :

var boite = parseInt("<?php echo $res['boite']; ?>");
var deteint = parseInt("<?php echo $res['deteint']; ?>");
var jaunissement = parseInt("<?php echo $res['jaunissement']; ?>");
var eraflures = parseInt("<?php echo $res['eraflures']; ?>");
var taches = parseInt("<?php echo $res['taches']; ?>");

if (boite != 0) {
	document.getElementById('case1').className = "on";
}else{	
	document.getElementById('case1').className = "off";
}

Et voilà la requête SQL, je ne sais pas trop ce dont vous avez besoin d'autre :

$annonces = $db->prepare("SELECT * FROM annonces1, marque WHERE annonces1.idm=marque.idm and ida = :ida");
			$annonces->execute(['ida' => $_GET['ida']]);
			if ($res['ida'] = $_GET['ida']) {
				if ($res = $annonces->fetch()){
					?>

A savoir que $res['boite'], $res['deteint'] etc.. ne peuvent être égale qu'à 1 ou 0.

J'ai bien entendu enlevé le parseInt et bien évidemment la console considère que la variable $res['boite'] n'est que cette chaine de caractère et pas vraiment une variable du coup ?

Comment faire ?

AbcAbc6

4 août 2021 à 4:38:02

Bonsoir,

>> A savoir que $res['boite'], $res['deteint'] etc.. ne peuvent être égale qu'à 1 ou 0.

Sur de cela?? Fait un var_dump() pour le savoir. Pourquoi ne pas utiliser une variable booléenne, ce serais plus adapté?

Pour ma part si j'attribue 1 ou 0 à $res['boite'] cela fonctionne.

L3 de ton deuxième code, tu utilises = qui est une affectation, au lieux de == qui est une comparaison.

En JS utilise let ou const plutôt que var pour la déclaration de variable.

MathisRobin

4 août 2021 à 13:52:18

AbcAbc6 a écrit:

Bonsoir,

>> A savoir que $res['boite'], $res['deteint'] etc.. ne peuvent être égale qu'à 1 ou 0.

Sur de cela?? Fait un var_dump() pour le savoir. Pourquoi ne pas utiliser une variable booléenne, ce serais plus adapté?

Pour ma part si j'attribue 1 ou 0 à $res['boite'] cela fonctionne.

L3 de ton deuxième code, tu utilises = qui est une affectation, au lieux de == qui est une comparaison.

En JS utilise let ou const plutôt que var pour la déclaration de variable.

var_dump($res['boite']) > <small style="color: #696969; font-family: 'Courrier new', monospace; font-style: italic;">D:\Logiciel\www\site\pages_principales\annonces.php:84:</small><small style="color: #696969; font-family: 'Courrier new', monospace; font-style: italic;">string</small>'0'

Et pourtant la class est "on".

>En JS utilise let ou const

J'ai remplacé tous les var par const.

>Pourquoi ne pas utiliser une variable booléenne, ce serais plus adapté?

Côté JS ?

LucasWerquin

4 août 2021 à 14:31:01

Oulà, le résultat de var_dump montre que tu ne récupère pas seulement un 0 ou 1, mais plutôt un bloc de code html. Et en l'occurrence ton '0' n'est pas contenu dans un jeu de balises. Compliqué pour récupérer cette valeur.

Il y a donc un souci côté php, il faudrait que $res['boite'] te renvoie la même chose, mais avec ton 0 ou 1 placé dans une balise, span, par exemple, qui aurait un attribut id, qui vaudrait "valeurBoite, par exemple.

Du coup, tu récupèrerais la valeur numérique de cette façon :

const boite = document.getElementById('boiteValue').innerHTML -0;

la soustraction de zéro sert à provoquer la conversion automatique de javascript, car si on tente une opération numérique ( hormis l'addition, car le signe + sert aussi à la concaténation ) sur une chaîne de caractères ne contenant QUE des caractères numériques, javascript convertit la chaîne de caractère en nombre. Mais sinon parseInt c'est bien aussi.

Pour l'utilisation de booléens, ça se passe d'abord en php, qui doit envoyer 'false' plutôt que 0, et 'true' plutôt que 0. L'avantage d'un booléen ( hormis une variable qui occupe moins de mémoire qu'un nombre ) est qu'il est directement évaluable dans une condition :

const boite = document.getElementById('boiteValue').innerHTML;
if(boite) //exécuté si le contenu de l'élément 'boiteValue' est 'true'
{
   //faire un truc
}
else // exécuté dans TOUS les autres cas ( donc bien faire attention aux contenus possibles de l'élément 'boiteValue' )
{
   //faire un autre truc
}

AbcAbc6 a écrit:

En JS utilise let ou const plutôt que var pour la déclaration de variable.

Bon, const, c'est pour les constantes, mais j'ai cru lire qu'entre var et let il y avait une subtilité dans la portée des variables déclarées dans des blocs, donc var n'est pas "obsolète", mais différent de let ? ( j'ai appris javascript à l'époque où let n'existait pas encore )

AbcAbc6

4 août 2021 à 15:26:25

@Matis

Difficile de voir ce qui ne vas pas comme cela. Que donne un console.log(boite); juste après sa déclaration.

Oui, une variable booléenne en JS. Je ne me rappelle plus si il y a conversion de type implicite en JS

@Lucas

Le var_dump() ne donne pas que la valeur de la variable qu'il contient il donne également son type, et dans ce cas ci le également le chemin eet le numéro de ligne le tout formater en HTML. Renseigne toi sur le fonctionnement de Xdebug qui gère les affichages d'erreur en PHP.

Pour la déclaration de variable en let ou const, je voulais m'assurer qu'il n'y avais pas de Hoisting (car je n'ai pas tout le code).

Pour const oui c'est pour les constantes ou toutes variable dont le principe est de respecter la condition de ne pas être réafecter. Tu peux très bien déclarer toutes tes variable en const. Plus d'info sur MDN

>> ( j'ai appris javascript à l'époque où let n'existait pas encore )

idem pour moi.

MathisRobin

4 août 2021 à 15:50:32

AbcAbc6 a écrit:

@Matis

Difficile de voir ce qui ne vas pas comme cela. Que donne un console.log(boite); juste après sa déclaration.

Oui, une variable booléenne en JS. Je ne me rappelle plus si il y a conversion de type implicite en JS

@Lucas

Le var_dump() ne donne pas que la valeur de la variable qu'il contient il donne également son type, et dans ce cas ci le également le chemin eet le numéro de ligne le tout formater en HTML. Renseigne toi sur le fonctionnement de Xdebug qui gère les affichages d'erreur en PHP.

Pour la déclaration de variable en let ou const, je voulais m'assurer qu'il n'y avais pas de Hoisting (car je n'ai pas tout le code).

Pour const oui c'est pour les constantes ou toutes variable dont le principe est de respecter la condition de ne pas être réafecter. Tu peux très bien déclarer toutes tes variable en const. Plus d'info sur MDN

>> ( j'ai appris javascript à l'époque où let n'existait pas encore )

idem pour moi.

console.log(boite) comme dit dans le titre du sujet retourne soit NaN "à cause" du parseInt

Soit <?php echo $res['boite']; ?> quand on enlève le parseInt

>Oui, une variable booléenne en JS

Avec :

const boite = new Boolean("<?php echo $res['boite']; ?>");
const deteint = new Boolean("<?php echo $res['deteint']; ?>");
const jaunissement = new Boolean("<?php echo $res['jaunissement']; ?>");
const eraflures = new Boolean("<?php echo $res['eraflures']; ?>");
const taches = new Boolean("<?php echo $res['taches']; ?>");

if (boite != true) {
	document.getElementById('case1').className = "on";
}else{	
	document.getElementById('case1').className = "off";
}

console.log(boite) retourne toujours true et donc le className est toujours off :/

-
Edité par MathisRobin 4 août 2021 à 15:50:58

AbcAbc6

4 août 2021 à 15:57:25

>> Soit <?php echo $res['boite']; ?> quand on enlève le parseInt

Ceci n'est pas logique, on dirait que le php n'est pas exécuté. Tu exécutes bien tout ce code dans le fichier php (annonces.php) pas dans un fichier JS (.js) !

MathisRobin

4 août 2021 à 16:04:34

AbcAbc6 a écrit:

>> Soit <?php echo $res['boite']; ?> quand on enlève le parseInt

Ceci n'est pas logique, on dirait que le php n'est pas exécuté. Tu exécutes bien tout ce code dans le fichier php (annonces.php) pas dans un fichier JS (.js) !

annonces.php :

<?php
			$annonces = $db->prepare("SELECT * FROM annonces1, marque WHERE annonces1.idm=marque.idm and ida = :ida");
			$annonces->execute(['ida' => $_GET['ida']]);
				if ($res = $annonces->fetch()){
					if ($res['ida'] == $_GET['ida']) {
					?>
					<div class="photonom"> <?php
					echo "<a id='noma'>".$res['nom']."</a>";
					echo "<img id='photoa' src='../imagesannonces/".$res['photo']."' width='350px' height='auto'>";
					?> 
					</div>
					<div class="tags"> <?php					
					if($res['tailles'] <> 0){
						echo "<a id='tailles'>".$res['tailles']."</a>";
					}else{
						echo "<a id='taillev'>".$res['taillev']."</a>";
					}
					echo "<a id='prix'>".$res['prix']."</a>";
					echo "<a id='marques'>".$res['marque']."</a>";
					?>
					<div id="grande">
						<div id="etat">
							<?php
								if ($res['new'] == 1) {
									echo "Neuf";
								}else{
									include "../etat.php";
								}
							?>						
						</div>
						<div id="check">
							<input type="checkbox" id="case1" name="coched" checked="" disabled="">
							<input type="checkbox" id="case2" name="coched" checked="" disabled="">
							<input type="checkbox" id="case3" name="coched" checked="" disabled="">
							<input type="checkbox" id="case4" name="coched" checked="" disabled="">
							<input type="checkbox" id="case5" name="coched" checked="" disabled="">
						</div>
					</div>
					<form method="post" name="fheart" action=""> <div class="likes">
						<input type="hidden" name="cache" value="<?= $res['ida'] ?>">
						<button id='heart' name='heart' type='submit'> </button>
					<?php
						echo "<a id='nombrel'>".$res['likes']."</a>";
						// var_dump($res['boite']);
						// var_dump($res['deteint']);
						// var_dump($res['jaunissement']);
						// var_dump($res['eraflures']);
						// var_dump($res['taches']);
					?></div> </form>
				<?php
				}
			}
		?>
				</div>
	</section>
	<script type="text/javascript" src="../java/jsannonces.js">  </script>
</body>

jsannonces.js :

const boite = new Boolean("<?php echo $res['boite']; ?>");
const deteint = new Boolean("<?php echo $res['deteint']; ?>");
const jaunissement = new Boolean("<?php echo $res['jaunissement']; ?>");
const eraflures = new Boolean("<?php echo $res['eraflures']; ?>");
const taches = new Boolean("<?php echo $res['taches']; ?>");

if (boite != true) {
	document.getElementById('case1').className = "on";
}else{	
	document.getElementById('case1').className = "off";
}

-
Edité par MathisRobin 4 août 2021 à 16:06:14

AbcAbc6

4 août 2021 à 17:21:18

Premier principe quand tu as du php dans un fichier il doit avoir l'extension .php (sauf configuration particulière de serveur qu'il est difficile de modifier pour un serveur mutualisé ce qui est le cas dans la majorité des cas. )

Deuxième principe le PHP s'exécute en premier et renvoie de l'HTML, CSS, JS bref que du texte.

Donc pour respecter le premier principe, change l'extension de ton fichier .js en .php et il faut l'inclure.

<!--<script type="text/javascript" src="../java/jsannonces.js"></script>-->
<?php    include 'annoncesJS.php'; ?>
</body>

annoncesJS.php renverra du JS avec les variables PHP du fichier qui l’inclus soit celle contenue dans annonces.php

<script type="text/javascript">
// ce que je voulais faire avec un boléan mais coté js on récupère de toute facon un string pas un bolean
// const boite =  <?php echo $res['boite'] === '0' ? "'FALSE'" : "'TRUE'" ; ?>;
const boite =  <?php echo $res['boite'] === '0' ?  0  : 1 ; ?>;
const deteint =  <?php echo $res['deteint'] === '0' ? 0 : 1 ; ?> ;
const jaunissement =  <?php echo $res['jaunissement'] === '0' ? 0: 1 ; ?>  ;
const eraflures =  <?php echo $res['eraflures'] === '0' ? 0 : 1 ; ?>  ;
const taches =  <?php echo $res['taches'] === '0' ? 0 : 1 ; ?>   ;

console.log(boite);
if (boite != 0 ) {
    document.getElementById('case1').className = "on";
    console.log('on');
}else{ 
    document.getElementById('case1').className = "off";
    console.log('off');
}
</script>

-
Edité par AbcAbc6 4 août 2021 à 17:25:59

MathisRobin

6 août 2021 à 0:38:08

AbcAbc6 a écrit:

Premier principe quand tu as du php dans un fichier il doit avoir l'extension .php (sauf configuration particulière de serveur qu'il est difficile de modifier pour un serveur mutualisé ce qui est le cas dans la majorité des cas. )

Deuxième principe le PHP s'exécute en premier et renvoie de l'HTML, CSS, JS bref que du texte.

Donc pour respecter le premier principe, change l'extension de ton fichier .js en .php et il faut l'inclure.

<?php    include 'annoncesJS.php'; ?>
</body>
annoncesJS.php renverra du JS avec les variables PHP du fichier qui l’inclus soit celle contenue dans annonces.php
<script type="text/javascript">
// ce que je voulais faire avec un boléan mais coté js on récupère de toute facon un string pas un bolean
// const boite =  <?php echo $res['boite'] === '0' ? "'FALSE'" : "'TRUE'" ; ?>;
const boite =  <?php echo $res['boite'] === '0' ?  0  : 1 ; ?>;
const deteint =  <?php echo $res['deteint'] === '0' ? 0 : 1 ; ?> ;
const jaunissement =  <?php echo $res['jaunissement'] === '0' ? 0: 1 ; ?>  ;
const eraflures =  <?php echo $res['eraflures'] === '0' ? 0 : 1 ; ?>  ;
const taches =  <?php echo $res['taches'] === '0' ? 0 : 1 ; ?>   ;

console.log(boite);
if (boite != 0 ) {
    document.getElementById('case1').className = "on";
    console.log('on');
}else{ 
    document.getElementById('case1').className = "off";
    console.log('off');
}
</script>
-
Edité par AbcAbc6 4 août 2021 à 17:25:59

Ok ok, ça m'a l'air de fonctionner !

J'ai deux trois questions si ça ne te dérange pas !

Du coup de base ça ne fonctionnait pas car le fichier n'étais pas en .php mais en .js ?

De plus je ne comprends pas à quoi sert cette partie la :

=== '0' ?  0  : 1 ; ?>;

Merci en tout cas pour ton temps !

AbcAbc6

6 août 2021 à 0:56:29

Bonsoir, oui c'est cela, le php n'est pas interpréter dans un fichier d'extension .js. ( hors config particulière du serveur)

Que ne comprends tu pas dans le code? La syntaxe? Ou pourquoi j'ai écris cela.

Si c'est la syntaxe je te renvois au cours que je t'invite une fois de plus (il me semble si ma mémoire ne me fait pas défaut) à lire, partie condition ternaire.

La raison est qu'il vaut mieux transmettre les informations dans le bon format. Ce qui évite de faire un parseInt() en JS.

Si tu attends un nombre, alors transmet un nombre plutôt qu'une chaine que tu devras transformer en nombre.

Si tu as d'autre question?

MathisRobin

6 août 2021 à 14:50:18

AbcAbc6 a écrit:

Bonsoir, oui c'est cela, le php n'est pas interpréter dans un fichier d'extension .js. ( hors config particulière du serveur)

Que ne comprends tu pas dans le code? La syntaxe? Ou pourquoi j'ai écris cela.

Si c'est la syntaxe je te renvois au cours que je t'invite une fois de plus (il me semble si ma mémoire ne me fait pas défaut) à lire, partie condition ternaire.

La raison est qu'il vaut mieux transmettre les informations dans le bon format. Ce qui évite de faire un parseInt() en JS.

Si tu attends un nombre, alors transmet un nombre plutôt qu'une chaine que tu devras transformer en nombre.

Si tu as d'autre question?

Nan c'était pour la raison ! Et non plus de question encore merci !