Bonjour,

je voudrai en cliquant uniquement sur la 2ème col de chaque ligne qu'un alert me renseigne la valeur de la 1ère et 2ème colonne,

mon code ci-dessous fonctionne presque à savoir que le num correspond bien à la ligne

par contre le mont = à la 1ère ligne peut importe sur quelle ligne je clique

qqun peut-il m'aider?

merci

function verif(data){
      var num = document.getElementById(data).innerHTML;
      var mont = document.getElementById('mont').innerHTML;
      alert(numotp + " - " + mont);
}

<tbody>
   <tr> 
       <td id="mont" align="right" style="font-size: small"><?php echo stripslashes(number_format($rq_data['mont'], 2, ',', ' ')); ?> € </td>         
       <td id="<?php echo $rq_data['num']; ?>" align="center" onclick="verif(this.id);"><?php echo stripslashes($rq_data['num']); ?></td>              
  </tr>
</tbody> 

-
Edité par OcinBzh 22 janvier 2020 à 0:51:22

Salut,

C'est quoi ces <br /> dans tes <tr /> ?
Seulement des balises td, th, script ou template à l’intérieur d'un tr : https://developer.mozilla.org/fr/docs/Web/HTML/Element/tr#R%C3%A9sum%C3%A9_technique

Quelque chose de ce genre peut-être ?

<table id="table">
    <tbody>
        <tr>
            <td class="firstCell">test1</td>        
            <td class="secondCell">test2</td>
        </tr>
    </tbody>
</table>

window.addEventListener('DOMContentLoaded', () => {
    document.getElementById('table').addEventListener('click', e => {
        if(e.target.classList.contains('secondCell'))
            alert('Contenu de la première cellule : ' +  e.target.previousElementSibling.innerText + '\nContenu de la seconde cellule : ' + e.target.innerText);
    });
});

C'est quoi ces <br /> dans tes <tr /> ?

je ne sais pas, ils sont apparus dans la fenêtre sans que je les demande

finalement j'ai trouvé un bout de code (à adapter) qui répond à ma demande

Merci BrainError!

<table class="Tableau">
     <thead>
        <tr>
         <th>Operateur</th>
         <th>SIM</th>
         <th>PUK</th>
         <th>Num ligne</th>
         <th>Volume</th>
         <th>Statut abo</th>
        <tr>    
       </thead>
       <tbody>
        <?php
         for($i=1;$i<10;$i++){
        ?>
         <tr id="tr_<?php echo $i;?>" onclick="getTrValues(this.id)">
           <td><?php echo $i;?></td>
           <td>Operateur_<?php echo $i;?></td>
           <td>SIM_<?php echo $i;?></td>
           <td>PUK_<?php echo $i;?></td>
           <td>Num ligne _<?php echo $i;?></td>
           <td>Volume _<?php echo $i;?></td>
           <td>Statut abo _<?php echo $i;?></td>
          </tr>
        <?php
         } //fin de la boucle de création des lignes
        ?>
      </tbody>
    </table>
 </body>
</html>
<script type="text/javascript">
 function getTrValues(idTr){
  var tr = document.getElementById(idTr);
  var cells =  tr.cells
  var cellcount = cells.length;
  for( c=0; c<cellcount; c++) {
    cell = cells[c];
    // ici tu en fais ce que tu veux.
    // par exemple : affichage dans la console du navigateur
    console.log("Cellule N° "+c + " = " + cell.innerHTML);
  }
 }
</script>

petite question,

avec le code ci-avant que faut-il que j'apporte pour que la fonction getTrValues(idTr) s'active seulement si je clique dans la colonne 'Num lign'?

j'ai essayé en déplaçant onclick="getTrValues(this.id)" (dans tr) dans
<td>Num ligne _<?php echo $i;?></td> sans succès forcément!

solution trouvée dans une autre discussion

il faut bloquer dans tous les td sauf celui souhaité l'activation de la function getTrValues(idTr)

ça tombe bien, j'ai eu un peu le même genre de problème hier.

Il faut que tu ajoute un attribut onclick (qui s'écrit tout en minuscule, au passage ) au bouton pour qu'il capture l'évenement et qu'il se propage pas aux élément parents:

<script type="text/javascript">
function captureEvent(e) {
	e.stopPropagation();
}
</script>
<table>
  <tr id='recid' style='background-color:#f59f9f;' onclick='chgt_etat_affaire(\"$recid\", \"pessimiste\")'>
     <td><form><input type='submit' value='enregistrer' onclick='captureEvent(event);' /></form></td>
  </tr>
</table>

ca donne donc au final un exemple comme celui-ci

<table class="Tableau">
     <thead>
        <tr>
         <th>Operateur</th>
         <th>SIM</th>
         <th>PUK</th>
         <th>Num ligne</th>
         <th>Volume</th>
         <th>Statut abo</th>
        <tr>    
       </thead>
       <tbody>
        <?php
         for($i=1;$i<10;$i++){
        ?>
         <tr id="tr_<?php echo $i;?>" onclick="getTrValues(this.id)">
           <td onclick='captureEvent(event);'><?php echo $i;?></td>
           <td onclick='captureEvent(event);'>Operateur_<?php echo $i;?></td>
           <td onclick='captureEvent(event);'>SIM_<?php echo $i;?></td>
           <td onclick='captureEvent(event);'>PUK_<?php echo $i;?></td>
           <td>Num ligne _<?php echo $i;?></td>
           <td onclick='captureEvent(event);'>Volume _<?php echo $i;?></td>
           <tdonclick='captureEvent(event);' >Statut abo _<?php echo $i;?></td>
          </tr>
        <?php
         } //fin de la boucle de création des lignes
        ?>
      </tbody>
    </table>
 </body>
</html>

<script type="text/javascript">
   function getTrValues(idTr){
      var tr = document.getElementById(idTr);
      var cells =  tr.cells
      var cellcount = cells.length;
      for( c=0; c<cellcount; c++) {
         cell = cells[c];
         // ici tu en fais ce que tu veux.
         // par exemple : affichage dans la console du navigateur
         alert("Cellule N° "+c + " = " + cell.innerHTML);
      }
   }

   function captureEvent(e) {
      e.stopPropagation();
   } 
</script>

-
Edité par OcinBzh 22 janvier 2020 à 23:22:03