Automatisation d'un code javascript
Résolu
ced3c
Messages postés
237
Date d'inscription
Statut
Membre
Dernière intervention
-
ced3c Messages postés 237 Date d'inscription Statut Membre Dernière intervention -
ced3c Messages postés 237 Date d'inscription Statut Membre Dernière intervention -
Bonjour tout le monde,
J'ai un script en javascript qui marche à l'heure actuelle.
Le problème est qu'il n'évolue pas par rapport aux données.
Les "input_tot_*" sont générés d'après le nombre de données de ma base de données.
1 input par élément.
(généré en php dans un while sous la forme id="input_tot_<?php echo $i;?>" ou $i=1 et s'incrémente tant qu'il y a des éléments de la base de données.
Je veux l'addition de tous les "input_tot_" et l'inscrire dans un input unique nommé "total_commande"
A l'heure actuelle j'arrive à faire le code manuellement, mais si je rajoute plus d'élément à ma base de données alors je devrais modifié mon script manuellement.
Est il possible de faire une boucle sur le code ci-dessus svp ? et surtout comment ?
Merci pour toute aide
J'ai un script en javascript qui marche à l'heure actuelle.
Le problème est qu'il n'évolue pas par rapport aux données.
var total_commande = document.getElementById('total_commande');
var resultat = parseFloat(document.getElementById('input_tot_1').value) +
parseFloat(document.getElementById('input_tot_2').value) +
parseFloat(document.getElementById('input_tot_3').value) +
parseFloat(document.getElementById('input_tot_4').value) +
parseFloat(document.getElementById('input_tot_5').value) +
parseFloat(document.getElementById('input_tot_6').value) +
parseFloat(document.getElementById('input_tot_7').value) +
parseFloat(document.getElementById('input_tot_8').value) +
parseFloat(document.getElementById('input_tot_9').value) +
parseFloat(document.getElementById('input_tot_10').value) +
parseFloat(document.getElementById('input_tot_11').value) +
parseFloat(document.getElementById('input_tot_12').value);
total_commande.value = parseFloat(Math.round(resultat * 100) / 100).toFixed(2) + "€";
}
Les "input_tot_*" sont générés d'après le nombre de données de ma base de données.
1 input par élément.
(généré en php dans un while sous la forme id="input_tot_<?php echo $i;?>" ou $i=1 et s'incrémente tant qu'il y a des éléments de la base de données.
Je veux l'addition de tous les "input_tot_" et l'inscrire dans un input unique nommé "total_commande"
A l'heure actuelle j'arrive à faire le code manuellement, mais si je rajoute plus d'élément à ma base de données alors je devrais modifié mon script manuellement.
Est il possible de faire une boucle sur le code ci-dessus svp ? et surtout comment ?
Merci pour toute aide
A voir également:
- Automatisation d'un code javascript
- Code ascii - Guide
- Comment déverrouiller un téléphone quand on a oublié le code - Guide
- Code puk bloqué - Guide
- Code activation windows 10 - Guide
- Code blocks - Télécharger - Langages
4 réponses
Bonjour,
Le plus simple est d'utiliser une class "fictive".
et d'utiliser cette classe pour avoir la liste de tous les INPUT à utiliser pour ton calcul.
dans ton php:
Puis dans le Javascript un truc du genre :
Cordialement,
Jordane
Le plus simple est d'utiliser une class "fictive".
et d'utiliser cette classe pour avoir la liste de tous les INPUT à utiliser pour ton calcul.
dans ton php:
echo " <input type='text' id='input_tot_".$i."' class='aclaculer' ... ";
Puis dans le Javascript un truc du genre :
//récupère TOUS les éléments dont la class est : aclaculer var elements = document.getElementsByClassName('aclaculer'); var resultat = 0; //boucle sur les elements elements.forEach(function(elm) { resultat += parseFloat(elm.value); });
Cordialement,
Jordane
Merci pour votre réponse Jordane
Je vais essayer votre méthode.
Par contre je ne sais pas à quoi correspond elm dans function(elm).
Je dois le remplacer par quelque chose ? ou le declarer ?
Pourriez vous m'expliquer svp ? (novice en javascript et php)
merci beaucoup
Je vais essayer votre méthode.
Par contre je ne sais pas à quoi correspond elm dans function(elm).
Je dois le remplacer par quelque chose ? ou le declarer ?
Pourriez vous m'expliquer svp ? (novice en javascript et php)
merci beaucoup
function acalculer(){
//récupère TOUS les éléments dont la class est : acalculer
var elements = document.getElementsByClassName('acalculer');
var resultat = 0;
//boucle sur les elements
elements.forEach(function(elm) {
resultat += parseFloat(elm.value);
});
}
J'ai bien mis la class="acalculer" dans les "input_tot_<?php echo $i;?"
Cependant j'ai une erreur dans la console qui m'indique :
elements.forEach is not a function
Ai je une erreur dans ce code svp ?
Merci
Oups au temps pour moi...
j'ai tellement l'habitude de bosser en jquery que j'oublie parfois certains morceaux pour le 'pur' javascript et ou ne sont pas fonctionnels pour certains navigateurs...
Ajoute ce code la en plus dans ta page (issue de : https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Array/forEach :
et puis si ça ne marche toujours pas, il est toujours possible de passer par une boucle "traditionnelle"
du genre :
(finalement la vielle méthode est sûrement la plus simple... :-) )
j'ai tellement l'habitude de bosser en jquery que j'oublie parfois certains morceaux pour le 'pur' javascript et ou ne sont pas fonctionnels pour certains navigateurs...
Ajoute ce code la en plus dans ta page (issue de : https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Array/forEach :
if (!Array.prototype.forEach) { Array.prototype.forEach = function(callback, thisArg) { var T, k; if (this == null) { throw new TypeError(' this vaut null ou n est pas défini'); } // 1. Soit O le résultat de l'appel à ToObject // auquel on a passé |this| en argument. var O = Object(this); // 2. Soit lenValue le résultat de l'appel de la méthode // interne Get sur O avec l'argument "length". // 3. Soit len la valeur ToUint32(lenValue). var len = O.length >>> 0; // 4. Si IsCallable(callback) est false, on lève une TypeError. // Voir : http://es5.github.com/#x9.11 if (typeof callback !== "function") { throw new TypeError(callback + ' n est pas une fonction'); } // 5. Si thisArg a été fourni, soit T ce thisArg ; // sinon soit T égal à undefined. if (arguments.length > 1) { T = thisArg; } // 6. Soit k égal à 0 k = 0; // 7. On répète tant que k < len while (k < len) { var kValue; // a. Soit Pk égal ToString(k). // (implicite pour l'opérande gauche de in) // b. Soit kPresent le résultat de l'appel de la // méthode interne HasProperty de O avec l'argument Pk. // Cette étape peut être combinée avec c // c. Si kPresent vaut true, alors if (k in O) { // i. Soit kValue le résultat de l'appel de la // méthode interne Get de O avec l'argument Pk. kValue = O[k]; // ii. On appelle la méthode interne Call de callback // avec T comme valeur this et la liste des arguments // qui contient kValue, k, et O. callback.call(T, kValue, k, O); } // d. On augmente k de 1. k++; } // 8. on renvoie undefined }; }
et puis si ça ne marche toujours pas, il est toujours possible de passer par une boucle "traditionnelle"
du genre :
var nbElm = elements.length; for (var i=0 ; i<=nbElm;i++){ resultat += parseFloat(elements[i].value); }
(finalement la vielle méthode est sûrement la plus simple... :-) )
Ah je viens de voir le debut de code et je vois des arrays.
Mon code n'en contient pas
J'ai fais mon tableau en bouclant sur les <tr> et <td>
Je ne sais pas du coup si cela marchera. (je suis débutant php aussi et j'arrête pas de remanier mon code à mesure que j'apprends un peu plus)
Je vais me tourner vers la 'vieille méthode' pour essayer ^^
Merci
Mon code n'en contient pas
J'ai fais mon tableau en bouclant sur les <tr> et <td>
Je ne sais pas du coup si cela marchera. (je suis débutant php aussi et j'arrête pas de remanier mon code à mesure que j'apprends un peu plus)
Je vais me tourner vers la 'vieille méthode' pour essayer ^^
Merci
Je pense qu'avec mes maigres connaissances de javascript je fais n'importe quoi avec votre code
J'en suis à ce niveau
Avec une erreur console sur le value de :
J'en suis à ce niveau
<script type="text/javascript">
function acalculer(){
var resultat = document.getElementById('total_commande');
var elements = document.getElementsByClassName('acalculer');
var nbElm = elements.length;
for (var i=0 ; i<=nbElm;i++){
resultat += parseFloat(elements[i].value);
}
document.getElementById('total_commande').value = resultat;
}
</script>
Avec une erreur console sur le value de :
resultat += parseFloat(elements[i].value);
function calculer(){ var elements = document.getElementsByClassName('acalculer'); var resultat = 0; var nbElm = elements.length; for (var i=0 ; i<nbElm;i++){ resultat += parseFloat(elements[i].value); } //et ici tu peux mettre le résultat dans ton champ input var total_commande = document.getElementById('total_commande'); total_commande.value = resultat; }