Formulaire calcul HTML/Javascript

Résolu/Fermé

AZ8268 Messages postés 2 Date d'inscription lundi 18 mai 2020 Statut Membre Dernière intervention 19 mai 2020 - Modifié le 18 mai 2020 à 13:52
AZ8268 Messages postés 2 Date d'inscription lundi 18 mai 2020 Statut Membre Dernière intervention 19 mai 2020 - 19 mai 2020 à 08:26

Bonjour,

Je laisse ce message dans le forum car je désire créer un formulaire de calcul pour des radiateurs.
J'ai déjà rédigé du code, cependant cela ne donne rien...!
Pouvez-vous me donner des indications ?


<html> 
<head> 
<script language="JavaScript" type="text/javascript"> 
function puissance()
{ 
//saisie utilisateur 
var volume = document.getElementByName('volume').value; 

//variables
var zone = document.getElementsByName('zone').value; 
var isolation = document.getElementsByName('isolation').value;
var nord = document.getElementsByName('nord').value;
var habitation = document.getElementsByName('habitation').value;
var temperature = document.getElementsByName('temperature').value;
var altitude = document.getElementsByName('altitude').value;
var sdb = document.getElementsByName('sdb').value;


//Si le champ vide 
if(volume == '')
{ 
document.getElementById('puissance').innerHTML = 'Merci de saisir le volume de la pièce'; 
document.getElementById("volume").style.border = "1px solid red"; 
return false; 
} 

//On teste si la valeur est de type numérique 
else if (isNaN(volume)) 
{ 
document.getElementById('puissance').innerHTML = 'Merci de saisir un chiffre'; 
return false; 
} 

else
{
document.getElementById('puissance').innerHTML = (volume+zone+isolation+nord+habitation+temperature+altitude+sdb)/2580;
}
</script>
</head> 
<body> 
Volume :
<INPUT TYPE="text" NAME="volume" value="volume">
<FORM>
Zone géographique :
<SELECT name="zone" size="1">
<OPTION value="95">1
<OPTION value="85">2
<OPTION value="75">3
</SELECT>
</FORM>
<FORM>
Isolation :
<SELECT name="isolation" size="1">
<OPTION value="-20">Mauvaise
<OPTION value="0">Bonne
<OPTION value="+20">Très bonne
</SELECT>
</FORM>
<FORM>
<label for="nord">Pièce au Nord</label>
<input type="checkbox" id="nord" name="nord" value="10">
</FORM>
<FORM>
Type d'habitation :
<SELECT name="habitation" size="1">
<OPTION value="0">Maison
<OPTION value="-10">Appartement
</SELECT>
</FORM>
<FORM>
Température :
<SELECT name="temperature" size="1">
<OPTION value="-10">18°
<OPTION value="0">20°
<OPTION value="10">22°
</SELECT>
</FORM>
<FORM>
Altitude :
<SELECT name="altitude" size="1">
<OPTION value="0">0 à 500m
<OPTION value="10">500 à 1000m
<OPTION value="20">1000 à 1500m
</SELECT>
</FORM>
<FORM>
<label for="nord">Salle de bain</label>
<input type="checkbox" id="sdb" name="sdb" value="10">
</FORM>
<input type="button" value="Calul" onclick="javascript:puissance();">
<div id="puissance"></div> 
</body> 
</html>

A voir également:

Javascript formulaire calcul automatique
Calcul moyenne excel - Guide
Recherche automatique des chaînes ne fonctionne pas - Guide
Clémence souhaite faire calculer automatiquement les prix de 30 produits dans trois devises. elle a déjà saisi une formule de calcul pour le tarif du premier produit dans la première devise. corrigez sa formule afin que recopiée vers le bas puis vers la droite, elle remplisse correctement tout le tableau. - Forum Excel
Message automatique thunderbird - Guide
Telecharger javascript - Télécharger - Langages

2 réponses

Réponse 1 / 2

jordane45 Messages postés 38288 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 15 novembre 2024 4 703
18 mai 2020 à 15:27

Bonjour,

Une accolade manquante
La "fonction" getElementByName qui n'existe pas ..

en gros, le code corrigé donne ça

<html>
  <head>
    <title> test </title>
    <meta charset='utf-8'>
  </head>
  <body>
  
  Volume :
<INPUT TYPE="number" id="volume" value="" placeholder="volume">
<FORM>
  Zone géographique :
  <SELECT id="zone" size="1">
      <OPTION value="95">1
      <OPTION value="85">2
      <OPTION value="75">3
  </SELECT>
</FORM>
<FORM>
  Isolation :
  <SELECT id="isolation" size="1">
      <OPTION value="-20">Mauvaise
      <OPTION value="0">Bonne
      <OPTION value="+20">Très bonne
  </SELECT>
</FORM>
<FORM>
  <label for="nord">Pièce au Nord</label>
  <input type="checkbox" id="nord" id="nord" value="10">
</FORM>
<FORM>
  Type d'habitation :
  <SELECT id="habitation" size="1">
      <OPTION value="0">Maison
      <OPTION value="-10">Appartement
  </SELECT>
</FORM>
<FORM>
  Température :
  <SELECT id="temperature" size="1">
      <OPTION value="-10">18°
      <OPTION value="0">20°
      <OPTION value="10">22°
  </SELECT>
</FORM>
<FORM>
  Altitude :
  <SELECT id="altitude" size="1">
      <OPTION value="0">0 à 500m
      <OPTION value="10">500 à 1000m
      <OPTION value="20">1000 à 1500m
  </SELECT>
</FORM>
<FORM>
  <label for="nord">Salle de bain</label>
  <input type="checkbox" id="sdb" id="sdb" value="10">
</FORM>

<input type="button" value="Calul" onclick="javascript:puissance();">
<div id="puissance">
</div>

    <script type="text/javascript">
 
 
 function puissance(){
    //saisie utilisateur
    var volume = parseFloat(document.getElementById('volume').value);

    //variables
    var zone = parseFloat(document.getElementById('zone').value);
    var isolation = parseFloat(document.getElementById('isolation').value);
    var nord = parseFloat(document.getElementById('nord').value);
    var habitation = parseFloat(document.getElementById('habitation').value);
    var temperature = parseFloat(document.getElementById('temperature').value);
    var altitude = parseFloat(document.getElementById('altitude').value);
    var sdb = parseFloat(document.getElementById('sdb').value);

    //Si le champ vide
    if(volume == ''){
      document.getElementById('puissance').innerHTML = 'Merci de saisir le volume de la pièce';
      document.getElementById("volume").style.border = "1px solid red";
      return false;
    }//On teste si la valeur est de type numérique
    else if (isNaN(volume)){
      document.getElementById('puissance').innerHTML = 'Merci de saisir un chiffre';
      return false;
    }else{
       console.log("Valeurs",volume,zone,isolation,nord,habitation,temperature,altitude,sdb );
      document.getElementById('puissance').innerHTML = (volume+zone+isolation+nord+habitation+temperature+altitude+sdb)/2580;
    }
 
 }     
    </script>
  </body>
</html>

Discussions similaires

Formulaire et calcul automatique

Calcul automatique pour formulaire HTML

Recupération de valeur d'un input HTML en JavaScript

tester champ formulaire avec javascript

[Javascript] récupération données formulaire

Vider les champs d'un formulaire