Test IF avec variable JS

Petit nouveau ! | 2 Messages

08 oct. 2024, 14:07

Bonjour,
Ci dessous un bout de code (de debug) qui fonctionne mal, et j'ai du mal à comprendre pourquoi :

Code : Tout sélectionner

<?php $largeurmaxi0 =500; //$largeurreelle0 ="<script type='text/javascript'>document.write(window.innerWidth);</script>"; //obtenir largeur fenêtre actuelle $largeurreelle0 ="<script type='text/javascript'>document.write(document.documentElement.clientWidth);</script>"; //obtenir largeur fenêtre actuelle if ($largeurreelle0 > $largeurmaxi0){ echo '<div class="tplge_searchboxContainer">'; echo str_replace('class="submit" value="' . $tx['search']['button'],'class="submit" title="' . $tx['search']['button'] . '" value="&nbsp;&nbsp;',searchbox()); echo '<div class="tplge_clearBoth"></div>'; echo '</div>'; echo $largeurreelle0; }else{ echo " ".$largeurmaxi0; } ?>
sans le test IF (IF, ELSE... en commentaire), je vois bien mes div entières et remplies ainsi que les 2 variables affichées à l’écran...
si je lance le code entier rien ne s'affiche (pleine page). On dirait que c'est le test IF qui bloque ?
NOTE : les 2 méthodes pour la variable $largeurreelle0 sont bonnes et vérifiées à l'ecran

Avez vous une idée du problème SVP ?
Avec mes remerciements
Steph

Avatar du membre
Mammouth du PHP | 1609 Messages

08 oct. 2024, 14:42

Salut, tu ne peux pas affecter à une variable php (exécuté par le serveur) une valeur provenant du javascript (exécuté par le client).

Lorsque tu appelles le script php (depuis ton navigateur), le serveur recevant la demande exécute tout le code php du script et génère une sortie qu'il envoie au client. Le client (le navigateur) reçoit alors cette sortie et fait son boulot selon ce qu'il y trouve. S'il y a du javascript dedans c'est à ce moment la qu'il est exécuté, par le navigateur.

Lors du if, $largeurreelle0 est égale à "<script type='text/javascript'>document.write(document.documentElement.clientWidth);</script>".

Tu testes donc "<script type='text/javascript'>document.write(document.documentElement.clientWidth);</script>" > 500.

Sans avoir vérifié comment php se comporte dans ce cas, j'imagine que les deux valeurs sont considérées comme des string et qu'il regarde donc si < (le premier caractère de la chaîne) est > à 5 (le premier chiffre du nombre).

Ce que tu devrais faire, c'est poser le div caché (css display none) et un code javascript qui affiche le div (css display block) si la condition est remplie.
Développeur web depuis + de 20 ans

Petit nouveau ! | 2 Messages

09 oct. 2024, 10:43

Merci pour vos explications claires, et je comprends mieux la difficulté de faire cohabiter du PHP et du JS.
Effectivement, maintenant je gère 2 div sur la même page que je masque alternativement avec "display none", dans mon fichier CSS
L’inconvénient c'est que je ne peux pas changer l'ID de la div (j'ai pas la main...) ... ce qui fait que j'ai 2 fois le même ID dans la page, mais cela ne parait pas bloquant.

Merci encore !
Cordialement,
Steph

Avatar du membre
Mammouth du PHP | 1525 Messages

09 nov. 2024, 13:22

Salut,
j'ai 2 fois le même ID dans la page, mais cela ne parait pas bloquant.
C'est pas bloquant mais "HTMLment" incorrect vis à vis des normes W3C.

Solution pour ton problème, crée une variable JS :
<script>
var largeurmaxi0 = 500;
var largeurreelle0 = document.documentElement.clientWidth;
const div_si_plus_large = `<div class="tplge_searchboxContainer">
	<?php echo str_replace('class="submit" value="' . $tx['search']['button'],'class="submit" title="' . $tx['search']['button'] . '" value="&nbsp;&nbsp;',searchbox()); ?>
	<div class="tplge_clearBoth"></div>
</div>`;

//ensuite, ta logique :
if (largeurreelle0 > largeurmaxi0){
   //afficher la constante div_si_plus_large là où tu le souhaite
}else{
   //rien afficher
}
</script>
Tu peux détecter dynamiquement le changement de largeur de l'écran en ajoutant un écouteur d'événement sur "resize" : window.onresize, voir https://developer.mozilla.org/fr/docs/W ... size_event