Calcul entre input

Résolu
Sinistrus Messages postés 1010 Date d'inscription   Statut Membre Dernière intervention   -  
Sinistrus Messages postés 1010 Date d'inscription   Statut Membre Dernière intervention   -
Bonsoir à tous !

J'ai un petit soucis dans mon tableau. La première zone (Quantite * Prix = Total) fonctionne, mais je n'arrives pas à attribuer aux autres zones de textes. Pouvez-vous me filer un petit coup de main svp ?

<script type="text/javascript">
function calcul(){
var prix = Number(document.getElementById("Fr_Quantite").value);
var quantite = Number(document.getElementById("Fr_Prix").value);
var ttc = Number(prix * quantite);
document.getElementById("Fr_Total").value = ttc;}
</script>

<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" id="TableauJaquery1" class="Tableau">
<thead><tr>
<td align="center"><strong>Libellé</strong></td>
<td width="80" align="center"><strong>Quantité</strong></td>
<td width="100" align="center"><strong>Prix</strong></td>
<td width="100" align="center"><strong>Total</strong></td>
</tr></thead>

<tbody><?php $Stat = $pdo->query("SELECT * FROM ".$TB_PRODUITS." WHERE ".$PAYS."='1' AND Activer = 1 AND Stock = '1' ORDER BY Marque ASC; "); while($data = $Stat->fetch(PDO::FETCH_ASSOC)){ ?><tr>

<td align="left" valign="middle"><?php echo $data["Libelle"]." ".$data["Contenance"]; ?></td>
<td align="center" valign="middle"><input type="text" class="span2" id="Fr_Quantite" style="width:100%; text-align:center; margin:0;" maxlength="2" value="0" onblur="calcul()"></td>
<td align="right" valign="middle"><input type="text" class="span2" id="Fr_Prix" style="width:100%; text-align:right; margin:0;" maxlength="2" readonly value="<?php echo $data["Prix"]; ?>"  onblur="calcul()"></td>
<td align="right" valign="middle"><input type="text" class="span2" id="Fr_Total" style="width:100%; text-align:right; margin:0;" maxlength="2" readonly value="0"></td>

</tr><?php ;} ?></tbody>
</table>

Merci de votre aide.

4 réponses

  1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Ah si ça y est ...j'ai compris....
    Donc voici:
    <script type="text/javascript">
    function calcul(i){
      var prix = Number(document.getElementById("Fr_Quantite_"+i).value);
      var quantite = Number(document.getElementById("Fr_Prix_"+i).value);
      var ttc = Number(prix * quantite);
      document.getElementById("Fr_Total_"+i).value = ttc;
    }
    </script>
    
    <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" id="TableauJaquery1" class="Tableau">
      <thead>
        <tr>
          <th align="center"><strong>Libellé</strong></th>
          <th width="80" align="center"><strong>Quantité</strong></th>
          <th width="100" align="center"><strong>Prix</strong></th>
          <th width="100" align="center"><strong>Total</strong></th>
        </tr>
      </thead>
    
      <tbody>
      <?php 
      $Stat = $pdo->query("SELECT * FROM ".$TB_PRODUITS." WHERE ".$PAYS."='1' AND Activer = 1 AND Stock = '1' ORDER BY Marque ASC; "); 
      $i = 0;
      while($data = $Stat->fetch(PDO::FETCH_ASSOC)){ 
      ?>
        <tr>
          <td align="left" valign="middle">
            <?php echo $data["Libelle"]." ".$data["Contenance"]; ?>
          </td>
          <td align="center" valign="middle">
            <input type="text" class="span2" id="Fr_Quantite_<?php echo $i;?>" style="width:100%; text-align:center; margin:0;" maxlength="2" value="0" onblur="calcul('<?php echo $i;?>')">
          </td>
          <td align="right" valign="middle">
           <input type="text" class="span2" id="Fr_Prix_<?php echo $i;?>" style="width:100%; text-align:right; margin:0;" maxlength="2" readonly value="<?php echo $data["Prix"]; ?>"  onblur="calcul('<?php echo $i;?>')">
          </td>
          <td align="right" valign="middle">
            <input type="text" class="span2" id="Fr_Total_<?php echo $i;?>" style="width:100%; text-align:right; margin:0;" maxlength="2" readonly value="0">
          </td>
        </tr>
      <?php 
        $i++;
      } 
      ?>
      </tbody>
    </table>
    

    Tu noteras que j'ai indenté le code ... ce qui le rend grandement plus facile à lire.
    Je t'invite à faire de même chez toi et aussi (et surtout !! ) lorsque tu postes du code sur le forum.
    1
  2. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
     
    Bonjour,

    Désolé .. mais je ne comprend pas la question....
    Que veux dire :" mais je n'arrives pas à attribuer aux autres zones de textes" ?
    TU n'arrives pas à attribuer... QUOI ? et à quelles "autres zones de texte" ?

    De plus ta question concerne le code javascript ou ton code php ????
    Si Javascript... pourquoi ne pas avoir posté dans le forum "javascript" ?

    NB: Je constate que tu utilises PDO.
    Ca n'a certainement rien à voir avec ton souci.... mais pour t'éviter de futurs soucis... je t'invite à appliquer ceci : https://forums.commentcamarche.net/forum/affich-37584941-php-pdo-gerer-les-erreurs

    0
  3. Sinistrus Messages postés 1010 Date d'inscription   Statut Membre Dernière intervention   17
     
    Merci beaucoup Jordan ! Tu me sauve la vie :'(

    Oui je sais que j'ai un petit (gros) soucis avec l'indentation quand je code... Je vais essayer d'y remédier :p

    En tout cas merci beaucoup !
    0
    1. jordane45 Messages postés 30426 Date d'inscription   Statut Modérateur Dernière intervention   4 830
       
      N'oublie pas de mettre le sujet en résolu.
      Bonne soirée
      Jordane
      0
  4. Sinistrus Messages postés 1010 Date d'inscription   Statut Membre Dernière intervention   17
     
    Petite amélioration :
    <script type="text/javascript">
      function calcul(i) {
        var prix = parseInt(document.getElementById("Fr_Quantite_" + i).value);
        var quantite = parseInt(document.getElementById("Fr_Prix_" + i).value);
        var ttc = parseInt(prix * quantite);
        document.getElementById("Fr_Total_" + i).value = ttc;
    	
    $( function(){
    total = 0;
    $inputs = document.querySelectorAll("[id^='Fr_Total_']");
    il=$inputs.length;
    for(i=0; i<il;i++) {total += + document.querySelectorAll("[id^='Fr_Total_']")[i].value;}
    document.getElementById("Resultat").innerHTML = total;
    });
    
    	document.getElementById("Pourcentage").innerHTML = total-(total*20)/100;
    
      }
    </script>
    
    <span id='Resultat'>0</span>
    <span id='Pourcentage'>0</span>
    
    <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" id="TableauJaquery1" class="Tableau">
      <thead>
        <tr>
          <th align="center"><strong>Libellé</strong></th>
          <th width="80" align="center"><strong>Quantité</strong></th>
          <th width="100" align="center"><strong>Prix</strong></th>
          <th width="100" align="center"><strong>Total</strong></th>
        </tr>
      </thead>
    
      <tbody>
      <?php 
      $Stat = $pdo->query("SELECT * FROM ".$TB_PRODUITS." WHERE ".$PAYS."='1' AND Activer = 1 AND Stock = '1' ORDER BY Marque ASC; "); 
      $i = 0;
      while($data = $Stat->fetch(PDO::FETCH_ASSOC)){ 
      ?>
        <tr>
          <td align="left" valign="middle">
            <?php echo $data["Libelle"]." ".$data["Contenance"]; ?>
          </td>
          <td align="center" valign="middle">
            <input type="text" class="span2" id="Fr_Quantite_<?php echo $i;?>" style="width:100%; text-align:center; margin:0;" maxlength="2" value="0" oninput="calcul('<?php echo $i;?>')">
          </td>
          <td align="right" valign="middle">
            <input type="text" class="span2" id="Fr_Prix_<?php echo $i;?>" style="width:100%; text-align:right; margin:0;" maxlength="2" readonly value="<?php echo $data["Prix"]; ?>" oninput="calcul('<?php echo $i;?>')">
          </td>
          <td align="right" valign="middle">
            <input type="text" class="span2" id="Fr_Total_<?php echo $i;?>" style="width:100%; text-align:right; margin:0;" maxlength="2" readonly value="0">
          </td>
        </tr>
        <?php 
        $i++;
      } 
      ?>
      </tbody>
    </table>
    
    0