Formulaire de calcul en HTML/JavaScript

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Formulaire de calcul en HTML/JavaScript

asp2p

Bonjour,
le projet était de faire un formulaire de calcul en HTML/JavaScript
se formulaire sert à calculer des quantités d'engrais liquide, mélanger avec une certaine quantité d'eau et à pulvériser sur une certaine surface.

Voici mon formulaire de calcul
http://bookgazon.hebergratuit.net/new2.php

après avoir parcouru et poser la question sur une dizaine de forum... seul une personne m'a fait se code

Code :

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h3 {color:red}
h4 {color:blue}
body {background-image:url('herbe.jpg');}
</style>
<script>
var produits = [
{'produit':'Délectose','quantite':5,'surface':10},
{'produit':'Briamide','quantite':3.5,'surface':5},
{'produit':'Cortofade','quantite':4,'surface':17}
];
var quantite = 0;
var surface = 0;
function creeListe() {
var html = "";
html = option ="<option value='x'>Sélectionner un produit</option>";
for(var i=0;i<produits.length;i++) {
var option ="<option value='"+i+"'>"+produits[i].produit+"</option>";
html=html+option;
}
document.getElementById('produit').innerHTML = html;
}
function init(value) {
quantite = 0;
surface = 0;
var xcp = document.getElementById('cp').value;
var xst = document.getElementById('st').value;
document.getElementById('info').innerHTML = "<br/>";
if (value!="x" ) {
quantite = produits[value].quantite;
surface = produits[value].surface;
document.getElementById('info').innerHTML = "Dosage = "+quantite+" ml par litre et 1 litre pour "+surface+" m2";
}
document.getElementById('resultat').innerHTML = '';
if (xcp != 0 && xst != 0) {
calcul();
}
}
function calcul() {
var idProduit = document.getElementById('produit').value;
if ( idProduit== "x" ) {
alert("Sélectionner un produit !!!" );
return;
}
if (isNaN(document.getElementById('cp').value)) {
alert("Contenance incorrecte !!!" );
return;
}
if (document.getElementById('cp').value <= 0) {
alert("Contenance incorrecte !!!" );
return;
}
if (isNaN(document.getElementById('st').value)) {
alert("Surface terrain incorrecte !!!" );
return;
}
if (document.getElementById('st').value <= 0) {
alert("Surface terrain incorrecte !!!" );
return;
}
var xcp = document.getElementById('cp').value;
var xst = document.getElementById('st').value;
var a = document.getElementById('resultat');
a.innerHTML = "<hr/>";
// dosage produit pour un m2
var dosage1M2 = quantite / surface;
// dosage produit total
var dose = dosage1M2 * xst;
var x = parseInt(dose*100)/100;
//a.innerHTML = a.innerHTML + 'Dose totale de '+produits[idProduit].produit+" = "+x+" ml<br/>";
// nombre de litres total
var litres = xst / surface;
var y = parseInt(litres*100)/100;
//a.innerHTML = a.innerHTML + "Quantité totale d'eau = "+y+" L<br/>";
// nombre de pulvérisateurs
//a.innerHTML = a.innerHTML + 'Prévoir :<br/>';
var pulve = y/xcp;
// Nombre de pulvérisateurs complets
var pulComp = parseInt(pulve);
if (pulComp != 0) {
var zC = quantite * xcp;
libelle = pulComp == 1 ? "pulvérisateur" : "pulvérisateurs";
//a.innerHTML = a.innerHTML + "* "+pulComp+" "+libelle+" de chacun "+xcp+" L et "+zC+" ml de "+produits[idProduit].produit+"<br/>";
}
// Pulvérisateur partiel
var pulPart = pulve - pulComp;
if (pulPart != 0) {
var w = pulPart * xcp * 100;
w = Math.round(w,2) / 100;
var z = w * quantite * 100;
z = Math.round(z,2) / 100;
//a.innerHTML = a.innerHTML + "* 1 pulvérisateur de "+w+" L et "+z+" ml de "+produits[idProduit].produit+"<br/>";
}
//------- Mélange à faire comme ceci
a.innerHTML = a.innerHTML + "<hr/>";
a.innerHTML = a.innerHTML + "<h3 color='red'>Mélange à faire comme ceci :</h3>";
if (pulComp != 0) {
libelle = pulComp == 1 ? "Dans le pulvérisateur rempli complètement/" : "Dans chacun des "+pulComp+" pulvérisateurs remplis complètement:";
a.innerHTML = a.innerHTML + "<h4>"+libelle+"</h4>";
a.innerHTML = a.innerHTML + "Litre(s) d'eau à mettre :<br/>";
a.innerHTML = a.innerHTML + "<input type='text' disabled value='"+xcp+" L'/><br/>";
a.innerHTML = a.innerHTML + "Millilitre(s) de "+produits[idProduit].produit+" à mettre :<br/>";
a.innerHTML = a.innerHTML + "<input type='text' disabled value='"+zC+" ml'/><br/>";
a.innerHTML = a.innerHTML + "Surface couverte en m2 :<br/>";
xSurface = surface * xcp;
a.innerHTML = a.innerHTML + "<input type='text' disabled value='"+xSurface+" m2'/><br/>";
}
if (pulPart != 0) {
a.innerHTML = a.innerHTML + "<h4>Dans le pulvérisateur rempli partiellement:</h4>";
a.innerHTML = a.innerHTML + "Litre(s) d'eau à mettre :<br/>";
a.innerHTML = a.innerHTML + "<input type='text' disabled value='"+w+" L'/><br/>";
a.innerHTML = a.innerHTML + "Millilitre(s) de "+produits[idProduit].produit+" à mettre :<br/>";
a.innerHTML = a.innerHTML + "<input type='text' disabled value='"+z+" ml'/><br/>";
a.innerHTML = a.innerHTML + "Surface couverte en m2 :<br/>";
xSurface = surface * w;
a.innerHTML = a.innerHTML + "<input type='text' disabled value='"+xSurface+" m2'/><br/>";
}
//------- Quantité pour couvrir le terrain
a.innerHTML = a.innerHTML + "<hr/>";
a.innerHTML = a.innerHTML + "<h3 color='red'>Quantité pour couvrir votre terrain :</h3>";
// Eau
a.innerHTML = a.innerHTML + "Quantité d'eau en litres :<br/>";
a.innerHTML = a.innerHTML + "<input type='text' disabled value='"+y+" L'/><br/>";
// Produit
a.innerHTML = a.innerHTML + "Quantité de produit en millilitres :<br/>";
a.innerHTML = a.innerHTML + "<input type='text' disabled value='"+x+" ml'/><br/>";
// Nombre de pulvérisateurs
a.innerHTML = a.innerHTML + "Nombre de pulvérisateurs :<br/>";
if (pulComp != 0) {
libelle = pulComp == 1 ? "pulvérisateur" : "pulvérisateurs";
a.innerHTML = a.innerHTML + "- "+pulComp+" "+libelle+" de "+xcp+" L<br/>";
}
// Pulvérisateur partiel
var pulPart = pulve - pulComp;
if (pulPart != 0) {
var w = pulPart * xcp * 100;
w = Math.round(w,2) / 100;
var z = w * quantite * 100;
z = Math.round(z,2) / 100;
a.innerHTML = a.innerHTML + "- 1 pulvérisateur de "+w+" L <br/>";
}
}
</script>
</head>
<body onload="creeListe()" style="font-family:verdana">
<table align="center" width="60%" bgcolor="lightgray" height="1300">
<tr><td valign="top">
<h2>Calcul</h2>
<select id="produit" onchange="init(this.value)">
</select>
<div id="info">
<br/>
</div>
<br/><br/><br/>
<table>
<tr>
<td>Contenance pulvérisateur (L)</td>
<td>:</td>
<td><input type="text" id="cp" value="0" /><br/></td>
</tr>
<tr>
<td>Surface Terrain (m2)</td>
<td>:</td>
<td><input type="text" id="st" value="0" /><br/></td>
</tr>
</table>
<input type="button" value="Valider" onclick="calcul();"/>
<div id="resultat">
</div>
</td></tr>
</table>
</body>
</html>

sauf que cette personne a fait le code à ça façon et ne la pas intégrer aux miens
donc je me retrouve avec un style de page qui ne ressemble pas trop au miens
http://bookgazon.hebergratuit.net/new1.php

Voici le style de la page avec sont code

c'est sympa de sa part j'en suis conscient surtout que sont code évite les erreurs de calcul de se style la

mais visuellement c'était pas se que j'attendais
je lui est demander si il serait possible d'intégrer sont code dans le mien histoire d'avoir ses fonctions de calcul mais avec la présentation de mon formulaire
mais il m'a répondu que je chercher trop dans le détail et que sont code été très bien ( sympa ! )

de plus avec sont code.. quand ont arrive sur la page il s'affiche seulement cette parti

puis une fois avoir choisi le produit dans la liste puis avoir rempli les champs... ont clique sur Valider...
et c'est seulement quand ont a cliquer sur Valider que les champs résultats s'affiche
http://bookgazon.hebergratuit.net/new1.php

hors moi dans mon formulaire
http://bookgazon.hebergratuit.net/new2.php
les cases s'affiche vide mais ont les vois quand même

je comprend pas pourquoi il a voulu caché les champs de résultat ( image ci-dessous ) et affichés les champs seulement qu'après avoir cliquer sur valider

franchement au début j'était content et j'essayer de comprendre sont code
mais au bout de 2 semaines à entendre des critiques et à me creuser le crane jusqu'à la migraine avec les yeux en feu je commence a perdre espoirs

je m'en remet à vous cher programmeurs si vous pouvez m'aider se serait vraiment géant car pour le moment le morale n'y est pas

Message cité 1 fois
Message édité par asp2p le 19-05-2017 à 21:34:55

Publicité

rat de combat

attention rongeur méchant!

asp2p a écrit :

le projet était de faire un formulaire de calcul en HTML/JavaScript
[...]
après avoir parcouru et poser la question sur une dizaine de forum... seul une personne m'a fait se code

Et ton rôle là dedans c'était quoi à part empocher des sous ou une bonne note?

règlement 0C et 0D

Aussi personnellement ton premier lien (j'ai pas regardé le reste) ne m'inspire pas confiance et je n'activerai pas JS là dessus. Un cookie jusqu'en 2037 soit, mais avec un truc (dé)crypté en AES... :??:

EDIT: Franchement c'est gros quand même!

Citation :

mais visuellement c'était pas se que j'attendais

Tu veux dire que ça ne correspond pas au cahier des charges du boulot que toi tu était censé faire?

Citation :

je lui est demander si il serait possible d'intégrer sont code dans le mien histoire d'avoir ses fonctions de calcul mais avec la présentation de mon formulaire
mais il m'a répondu que je chercher trop dans le détail et que sont code été très bien ( sympa ! )

Tu fais chier sur une dizaine (!!!) de forums, finalement tu trouves un con qui te fait ton boulot et après tu te plains en plus? Et ben...

Message édité par rat de combat le 19-05-2017 à 22:40:33

asp2p

Post a cloturé j'irait voire ailleurs
bonne continuation

MaybeEijOrNot

but someone at least

Désolé on mange bio ici. [:julm3]

---------------
C'est en écrivant n'importe quoi qu'on devient n'importe qui.

FORUM HardWare.fr

Programmation

Javascript/Node.js

Formulaire de calcul en HTML/JavaScript

Sujets relatifs
Récupérer des informations dans un tableau HTML	Champs email en code qui renvoi vers formulaire d'inscription
Ecrire un tableau dans une feuille de calcul	[HTML/PHP/JS] Afficher x pages en alternances sur timer
récupérer texte d'un formulaire pour une fonction javascript	peut on execut du javascript pas a pas en espionnant les variables?
Enregistrer les données contenues dans un formulaire excel (textbox) v	Alignement d'articles.. Problème HTML/CSS
Problème script javascript
Plus de sujets relatifs à : Formulaire de calcul en HTML/JavaScript

Page générée en 0.127 secondes