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
Message automatique thunderbird - Guide
Formulaire de réclamation facebook - Guide
Telecharger javascript - Télécharger - Langages

2 réponses

Réponse 1 / 2

jordane45 Messages postés 38346 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 16 décembre 2024 4 717
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