Solution somme input value de formulaire différents

**AngellaM** · 05/03/2014, 11h59

Bonjour à tous ,
J'ai commencé le développement de mon application pour le calcul de la somme d'une commande d'un client avec un couple produit/quantité, mais je me suis bloqué dans un truc qui parait simple mais j'arrive pas a le faire en fait je veux additionner le total affiché d'un produit avec les autre ( produit1* Qté1 + Pdt2*Qté2 + ainsi de suite ..)
l'application maintenant affiche le total pour un seul choix de produit et efface le dernier je veux afficher le total de façon a garder tout les produits selectionner pour vous mettre dans le cadre voilà un lien pour mon apps www.securitesanscompromis.com/appsec/index.php

Et aussi voilà mon code complet

PS: Cliquez sur la cercle orangé numero 1 pour tester

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Apps</title>
	<meta name="description" content="">
	<meta name="author" content="">
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/jquery-ui.css">
	<script src="js/jquery-1.9.1.min.js"></script>
	<script src="js/jquery-ui.min.js"></script>
</head>
<body>
	<div class="container">
		<div class="mainbox">
			<h1 style="color:#F5520C">Application securité MIG </h1>
			<h2></h2>
		    <div class="switch a"><a href="#" id="a" title="Centrale transmetteur telephonique">1</a></div>
			<div class="switch b"><a href="#" id="b" title="Sirène intérieur">2</a></div>
			<div class="switch c"><a href="#" id="c" title="Sirène extérieur avec flash">3</a></div>
			<div class="switch d"><a href="#" id="d" title="Caméra de levée de doute">4</a></div>
			<div class="switch e"><a href="#" id="e" title="Détecteurs de mouvement">5</a></div>
			<div class="switch f"><a href="#" id="f" title="Détecteur d'ouverture">6</a></div>
			<div class="switch g"><a href="#" id="g" title="Détecteur de fumée">7</a></div>
			<div class="switch h"><a href="#" id="h" title="Télécommande">8</a></div>
			<div class="switch i"><a href="#" id="i" title="Clavier LCD avec lecteur de badge">9</a></div>
		</div>
		<div class="counter">
			<table>
				<tr>
					<th>Total approximatif</th>
				</tr>
				<tr>
					<td id="result">0 DT</td>
				</tr>
			</table>
			<div class="buy">
				<a href="http://www.securitesanscompromis.com/devis_securite.php" class="button" style="width: 100px;">Passer votre devis</a>
			</div>
		</div>
	</div>
	<div id="form-a" style="display:none;">
        <form action="#";>
       		<table>
       			<tr>
       				<td id="name_form">Centrale transmetteur téléphonique</td>
       			</tr>
       			<tr>
       				<th>Prix</th>
       				<td><span id="price">12</span></td>
       			</tr>
       			<tr>
       				<th>Quantité</th>
       				<td><input type="text" id="quantity"></td>
       			</tr>
       			<tr>
       				<td colspan="2"><br><button id="add-order" title="Ajouter ce produit à la carte">Ajouter</button><button id="cancel-order" title="Annuler article & vider la Carte">Annuler</button></td>
       			</tr>
       		</table>
        </form>
   	</div>
	<div id="form-b" style="display:none;">
        <form action="#";>
       		<table>
       			<tr>
       				<td id="name_form">Sirène externe</td>
       			</tr>
       			<tr>
       				<th>Prix</th>
       				<td><span id="price2">10</span></td>
       			</tr>
       			<tr>
       				<th>Quantité</th>
       				<td><input type="text" id="quantity2"></td>
       			</tr>
       			<tr>
       				<td colspan="2"><br><button id="add-order2" title="Ajouter ce produit à la carte">Ajouter</button><button id="cancel-order2" title="Annuler article & vider la Carte">Annuler</button></td>
       			</tr>
       		</table>
        </form>
   	</div>
    </div>
	<script type="text/javascript">
 
        </script>
</body>
</html>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
$(document).ready(function(){
    $('#a').click(function(){
        $('#form-a').dialog({modal:true});   
    });
    });
$(function() {
    $( document ).tooltip();
});
$("#cancel-order").click(function() {
    document.getElementById("result").innerHTML = "0";
    document.getElementById("quantity").value = "0";
    $("#form-a").dialog("Fermer");
});
$("#add-order").click(function() {
    var price = document.getElementById('price').innerHTML;
    var quantity = document.getElementById("quantity").value; 
    var total = price * quantity;
    var totals = total + "DT";
    document.getElementById("result").innerHTML = totals;
    $("#form-a").dialog("Fermer");
});
$(document).ready(function(){
    $('#b').click(function(){
        $('#form-b').dialog({modal:true});   
    });
});
$(function() {
    $( document ).tooltip();
});
$("#cancel-order2").click(function() {
    document.getElementById("result").innerHTML = "0";
    document.getElementById("quantity2").value = "0";
    $("#form-b").dialog("Fermer");
});
$("#add-order2").click(function() {
    var price = document.getElementById('price2').innerHTML;
    var quantity = document.getElementById("quantity2").value; 
    var total = price * quantity;
    var totals = total + "DT";
    document.getElementById("result").innerHTML = totals;
    $("#form-b").dialog("Fermer");
});

Merci de votre aide, si vous avez un autre code je suis prenante aussi .
je suis perdu et je dois faire la livraison dans 2 jours

**Spartacusply** · 06/03/2014, 11h21

Il faut que tu passes par un tableau pour stocker tous les prix arriver jusqu'à présent.

Egalement ne dupliques pas ton code, utilise une classe pour le clic sur un bouton, et non les id.

**SpaceFrog** · 06/03/2014, 11h49

Heu, pas en rapport réel avec le sujet de la question, mais si tu utilises jquery ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
  document.getElementById("result").innerHTML = "0";
    document.getElementById("quantity").value = "0";

=>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
  $("#result").html("0");
 $("#quantity").val(0);

Solution somme input value de formulaire différents

jQuery

Vue hybride

Discussions similaires

Partager

Partager