"convertir" div en JavaScript en php

Fermé
Brunodurant Messages postés 13 Date d'inscription dimanche 14 novembre 2021 Statut Membre Dernière intervention 23 août 2022 - Modifié le 22 déc. 2021 à 11:24
Brunodurant Messages postés 13 Date d'inscription dimanche 14 novembre 2021 Statut Membre Dernière intervention 23 août 2022 - 22 déc. 2021 à 12:06
Bonjour à tous

Je vous explique, j'ai un petit soucis.

Dans un formulaire en PHP, que j'ai appelé index.php:

Etape 1: j'ai placé quelques checkbox, comme suit:
<input name="image1" type="checkbox" class="case" id="1" value="1">
<input name="image2" type="checkbox" class="case" id="2" value="2">
<input name="image3" type="checkbox" class="case" id="3" value="3"> 

/**


* etc.

*/


Etape 2: j'ai placé un script JavaScript me permettant de savoir l'ordre des checkbox cochées par un utilisateur:
<script>
console.clear();
var checkbox = document.getElementsByClassName('case'),
aff = document.getElementById('aff'),
ordre=[];
for(var i=0, len=checkbox.length; i<len; i++){
checkbox[i].onclick=function(){
if(this.checked)
ordre.push(this.value);
else if((key = ordre.indexOf(this.value)) >-1 )
ordre.splice(key,1);        
aff.innerHTML = ordre.join(' - ');};}
</script>

Etape 3: j'ai le résultat:
<div id="aff"></div>

Jusque là tout se passe bien.

Etape 4: je "déplace" mon div dans une variable en php et je fais un echo
<?php
$rang='<div id="aff"></div>';
echo $rang;
?>

Tout s'affiche correctement

Etape 5: j'envoie le contenu de ma variable en php sur une autre page (page1.php)
[CODE]
<input type="hidden" name="rang" value="<?php $rang;?>">
[/CODE]
Etape 6: dans ma page1.php, je récupére ma variable
[CODE]
$rang = isset($_POST['rang']) ? $_POST['rang'] : "";
[/CODE]
Etape 7: je l'affiche dans ma page1.php
[CODE]
echo $rang;
[/CODE]
et ... ça ne fonctionne pas

Du coup, j'ai essayé d'éliminer pas à pas les éventuels problèmes.

J'ai ajouté le mot "salut" dans mon input hidden de la page index.php pour voir si je ne m'étais pas trompé dans le input ou dans la récupération de la variable dans la page1.php
<input type="hidden" name="rang" value="<?php $rang; echo "salut"; ?>">

J'ai uniquement le mot "Salut" qui apparaît.

Du coup je pense que c'est le div dans ma variable $rang qui pose problème.

Est-ce que le problème vient du fait que javascript est côté client et que php est côté serveur ?
J'ai vu qu'il y avait peut être une solution avec Ajax, mais je ne l'ai pas comprise.

Est-ce que quelqu'un parmi vous pourrait m'expliquer ?

Merci beaucoup

A bientôt

Bruno


EDIT : Correction des balises de code
A voir également:

2 réponses

jordane45 Messages postés 38454 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 22 mars 2025 4 740
22 déc. 2021 à 11:31
Bonjour,

Déjà, les balises de code sur ce forum c'est comme ça :
https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code


Ensuite ...
A ton étape 2, à la place (ou en plus.. ) de remplir ta div .. rempli directement l'input hidden avec la valeur...

1 - on ajoute un ID à ton input .. c'est plus simple pour le cibler en javascript
<input type="hidden" name="rang" id="rang" value="">


2 - .. Dans ton js
<script>
console.clear();
var checkbox = document.getElementsByClassName('case'),
var aff = document.getElementById('aff'),
var inpRang = document.getElementById('rang');
var ordre=[];

for(var i=0 ; i < checkbox.length; i++){
  checkbox[i].onclick=function(){
    if(this.checked)
      ordre.push(this.value);
    else if((key = ordre.indexOf(this.value)) >-1 )
      ordre.splice(key,1);        

    aff.innerHTML = ordre.join(' - ');
    inpRang.value = ordre.join(' - ');
  };
}
</script>


0
Brunodurant Messages postés 13 Date d'inscription dimanche 14 novembre 2021 Statut Membre Dernière intervention 23 août 2022
22 déc. 2021 à 12:06
Super

merci pour ta réponse.

Alors je crois que je n'ai pas compris.

J'ai remplacé mon script javascript par le tien. J'ai modifié mon étape 5 (je n'arrive plus à modifier les balises code dans mon message) par ton input. Du coup, j'ai supprimé mes étapes 3 et 4 (ai-je raison ?).

ça ne fonctionne pas mais je ne suis pas sûr d'avoir bien compris.

Merci et a+
0