Discussion :

[rvm31]

Bonjour

j'ai un addevent listener qui me permet e changer l'affichage, ce changement je veux le récupérer dans u formulaire pour pouvoir updater la base.
dans le HTML j'ai des éléments affichés par une boucle while

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
 
<form name="formulaire" action="equipe_intermittents_verif.php" method="post">
       <?php
       $i=0;   
       while ($listeinter = $affich_equipe->fetch()):
 
         $intermittent->hydrate($listeinter);
       $prod->hydrate($listeinter);
       $i++;
       if($i==1)
        echo"
      <div class='col-sm-10 col-sm-offset-1 col-xs-12 fenetre'><h1>".strtoupper($prod->titre_presta())."</h1>
      </div>
      <div class='form-group col-sm-10 col-sm-offset-1 col-xs-12 fenetre'>";
      ?>
      <div class="col-sm-4">
      <input type="hidden" name="idprod[]" class="form-control" value="<?php echo$_POST['idprod'] ?>"> 
      <input type="hidden" name="id_intermittent[]" class="form-control" value="<?php echo $intermittent->id() ?>"> 
       <div class=" bloc-intermittents intermittents-2 confirm" >
        <div class="confirm2 col-sm-8 col-sm-offset-2 " data-confirmation="0">En attente
         <input type="text"  class="confirmation" name="confirm[]" value="0"></div>

j'ai le script suivant

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
var list=document.getElementsByClassName("confirm2");
 
for(i=0;i<list.length;i++){
  list[i].addEventListener('mouseover', function(){ 
    this.style.cursor = "pointer";
  });
  list[i].addEventListener('click', function(){
    if (this.dataset.confirmation=="0") {
      this.innerHTML = "Confirmé";
      this.dataset.confirmation="1";
      this.childNodes[1].value="1";
      this.parentNode.style.borderColor='#69D240';
      this.style.backgroundColor='#69D240';
      this.style.color='black';
 
    }else if (this.dataset.confirmation=="1"){
      this.innerHTML = "En attente";
      this.dataset.confirmation="0";
      this.parentNode.style.borderColor='red';
      this.style.backgroundColor='red';
      this.style.color='white';
    }
  }, true);
}

quand je clique sur l'élément de class confirm2 j'ai une erreur Cannot set property 'value' of undefined
pourtant quand j'explore le dom en tapant

Code :

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

list[x].childNodes[1]

l'inspecteur de page me renvoie bien mon élément

[rvm31]

je n'ai pas trouvé comment résoudre mon souci, j'ai donc changé le code et dans le JS je fait un innerHTML avec un input hidden et 2 valeurs de value

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
var list=document.getElementsByClassName("confirm2");
  vari=0;
  for(i=0;i<list.length;i++){
   list[i].addEventListener('mouseover', function(){ 
     this.style.cursor = "pointer";
   });
 
   list[i].addEventListener('click', function(){
    if (this.dataset.confirmation=="non") {
      this.innerHTML = 'Confirmé <input type="hidden" name="confirm[]" value="oui">';
 
      this.dataset.confirmation="oui";
      this.parentNode.style.borderColor='#69D240';
      this.style.backgroundColor='#69D240';
      this.style.color='black';
 
    }else if (this.dataset.confirmation=="oui"){
      this.innerHTML = 'En attente <input type="hidden" name="confirm[]" value="non">';
      this.dataset.confirmation="non";
      this.parentNode.style.borderColor='red';
      this.style.backgroundColor='red';
      this.style.color='white';
    }
  }, true);
 }