Formulaire calcul HTML/Javascript

Résolu

AZ8268 Messages postés 2 Statut Membre -
AZ8268 Messages postés 2 Statut Membre - 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>

Afficher la suite

2 réponses

jordane45 Messages postés 30427 Date d'inscription Statut Modérateur Dernière intervention 4 832

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>

Réponse 2 / 2
AZ8268 Messages postés 2 Statut Membre

Merci beaucoup !
C'est exactement ce que je voulais
0

Formulaire calcul HTML/Javascript

2 réponses

Discussions similaires

Newsletters