comment ajouter pour la boucle à l'intérieur de la fonction en javascript?

Question

Je voudrais ajouter pour la boucle à l'intérieur de la fonction. Je voudrais apparaître l'évaluation finale qui ne sont pas complètement remplir de chaque zone de texte. Exemple si je ne place que 80 dans le premier classement, apparaît automatiquement l'évaluation finale.

Comment faire cela?

Code HTML

<table border="0" class="table table-bordered" > 
    <tbody> 
    <tr class="bg-primary"> 
    <th rowspan="2">LEARNING AREAS</th> 
    <th colspan="4">Periodic Rating</th> 
    <th colspan="2">FINAL RATING</th> 
    <th rowspan="2">REMARKS</th> 
    </tr> 
    <tr align="center" class="bg-primary"> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
    <td>4</td> 
    <td>DES</td> 
    <td>NUM</td> 
    </tr> 
    <tr> 
    <td>Filipino</td> 
    <td align='center'><input class="text" size="10" type="number" min="65" max="100" name="Filipino13" id="fil13" oninput="sum38();" onkeyup="average4();" value="<?php echo $filipino13;?>"></td> 
    <td align='center'><input class="text" size="10" type="number" min="65" max="100" name="Filipino14" id="fil14" oninput="sum38();" onkeyup="average4();" value="<?php echo $filipino14;?>"></td> 
    <td align='center'><input class="text" size="10" type="number" min="65" max="100" name="Filipino15" id="fil15" oninput="sum38();" onkeyup="average4();" value="<?php echo $filipino15;?>"></td> 
    <td align='center'><input class="text" size="10" type="number" min="65" max="100" name="Filipino16" id="fil16" oninput="sum38();" onkeyup="average4();" value="<?php echo $filipino16;?>"></td> 
    <td align='center'><input class="text" size="10" type="text" name="Des_fi4" id="des29" value="<?php echo $des_fi4;?>"></td> 
    <td align='center'><input class="text" size="10" type="text" name="Aver24" id="ave29" oninput="average4();" value="<?php echo $aver24;?>"></td> 
    <td align='center'><input class="text" size="10" type="text" name="Remark_fi4" id="remark29" value="<?php echo $remark_fi4;?>"></td>  
    </tr> 
</tbody> 

Ceci est du code javascript pour qui utilisent la fonction

code JavaScrip

function sum38() { 
    var fil13 = document.getElementById('fil13').value; 
    var fil14 = document.getElementById('fil14').value; 
    var fil15 = document.getElementById('fil15').value; 
    var fil16 = document.getElementById('fil16').value; 

    var result29 = (parseInt(fil13) + parseInt(fil14) + parseInt(fil15) + parseInt(fil16))/4; 
    var total29 = result29.toFixed(2); 

    if (!isNaN(total29)) { 
     document.getElementById('ave29').value = total29; 

    if (result29>=75){ 
    document.getElementById('remark29').value = 'Passed'; 
    } 
    else 
    { 
     document.getElementById('remark29').value = 'Failed'; 
    }   
    } 
    if(result29 >= 90){ 
    document.getElementById('des29').value = "(A)"; 
    } 

    else if(result29 >=85){ 
    document.getElementById('des29').value = "(P)"; 
    } 

    else if(result29 >=80){ 
    document.getElementById('des29').value = "(AP)"; 
    } 

    else if(result29 >=75){ 
    document.getElementById('des29').value = "(D)"; 
    } 


    else if(result29 >=74){ 
    document.getElementById('des29').value = "(B)"; 
    } 
    else if(result29 >=0){ 
    document.getElementById('des29').value = "(B)"; 
    } 
} 

Answer 1

Vous n'avez pas besoin de boucle à travers elle. Stocker simplement l'ancienne valeur dans un attribut de données, et chaque fois que vous faites une entrée, ajoutez la nouvelle valeur au total tout en soustrayant l'ancienne valeur.

<td align='center'> 
    <input class="filipino text" size="10" type="number" min="65" max="100" name="Filipino13" id="fil13" oninput="sum38(this);" data-old-value="<?php echo $filipino13;?>" value="<?php echo $filipino13;?>"> 
</td> 

I ajouté nom de la classe filipino et data-old-value ci-dessus, et this en tant que paramètre dans votre attribut oninput. J'ai également supprimé votre attribut onkeyup.

function sum38(element) { 
    var des29  = document.getElementById('des29'); 
    var remark29 = document.getElementById('remark29'); 
    var ave29  = document.getElementById('ave29'); 
    var totalValue = des29.value || 0; 
    var oldValue = element.dataset.oldValue || 0; 
    var newValue = element.value || 0; 
    var numberOfGrades = document.querySelectorAll('.filipino').length; 

    totalValue  = totalValue + newValue - oldValue; 

    des29.value = totalValue; 
    ave29.value = totalValue/numberOfGrades; 
    remark29.value = (totalValue >= 75) ? 'Passed' : 'Failed'; 
} 

Je voudrais également refactoriser ces instructions if dans une nouvelle fonction pour une meilleure lisibilité. La ligne des29.value devrait alors être quelque chose comme des29.value = calculateGrade(totalValue) où la fonction calculateGrade() renvoie la note correcte.

Ce n'est pas une solution complète, mais cela vous mettra sur la bonne voie.