Creer un configurateur avec des prix

**jojo57** · 06/06/2007, 10h25

oui mais si je fais comme ca, le montant des frais de port ne sera pas dynamique...

Je me suis servi de ce que tu ma dit pour avoir les frais de port, voila ce que ja irajouter:

Code :

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

1
2
3
4
5
6
7
8
$port="fraisport".$rowrecupproduitrubriqueKit['id_produit'];
 
			if ($rowrecupproduitrubriqueKit['nom'] != "Aucun")
			{
			$idfraisport="/".$rowrecupproduitrubriqueKit['id_fraisport'];
			$fraisport=$rowrecupproduitrubriqueKit['id_fraisport'];
			echo "<input id='$port' name='fraisport' type='texte' value='$fraisport'/>";
			}

Et dans la value de mon radio jai mit ca :

Code :

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

value='$prix$idfraisport'

et dans la JS voila ce que jai fais au moment de la boucle qu iverifie si un radio est checked :

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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
		for(j=0;j<TabRadios.length;j++)
		{
 				var reflabel='lbl'+TabRadios[j].id;
		    	if ( (TabRadios[j].checked==true) && (TabRadios[j].value!='0') )
				{ 
 
					var radio = TabRadios[j].value.split('/'); 
					Prix = radio[0]; 
					FraisPort = radio[1];
					alert(Prix);
					alert(FraisPort);
					alert(Total);
 
 
					//alert(reflabel.replace("lblproduit",""));
 
					NbArticles++;
					Total+=Number(Prix.value);
					TotalReduc1+=Number(Prix.value);
					TotalReduc2+=Number(Prix.value);
		    	    document.getElementById(reflabel).style.color='red';
		    	    document.getElementById(reflabel).style.fontWeight='bold';
		    	}
		    	else
				{                       
					document.getElementById(reflabel).style.color='black';
		    		document.getElementById(reflabel).style.fontWeight='normal';
		    	}    		    	                            
		}  
	//réduction suivant le nombre d'articles selectionné	 
	if (NbArticles == 0)
	{
	Reduc2 = 0;
	}
	else if (NbArticles == 1)
	{
	Reduc2 = 1;
	}
	else if (NbArticles == 2)
	{
	Reduc2 = 2;
	}
	else if (NbArticles == 3)
	{
	Reduc2 = 4;
	}
	else if (NbArticles == 4)
	{
	Reduc2 = 6;
	}
 
}
 
document.getElementById('Art').value=NbArticles
document.getElementById('Total').value=Total + " €"
document.getElementById('TotalReduc1').value=(Total - Reduc1) + " €"
document.getElementById('TotalReduc2').value=(TotalReduc1 - Reduc2) + " €"

quand je fais alert du prix puis alert des fraisd de port ca fonctionne sauf que dans le total ca ne m'affiche pas le prix mais NaN €

Saurais tu pourquoi?

Ma facon de faire est bonne?

**SpaceFrog** · 06/06/2007, 10h27

je n'ai pas compris pourquoi les frais de port ne seraient pas dynamiques ???

et tu ne l'as pas mis au bon endroit,
mets le juste àprès avoir incrémenté le nombre d'articles ...

**jojo57** · 06/06/2007, 10h33

Non rien javais pas compris ta solution mais c bon maintenant

Sinon jai changé de place comme tu me la dit mais ca ne fonctionne tj pas, il decoupe bien les fdp et le prix mais le total tj pareil...

Je vais faire des reduction suivant les frais de port, a savoir prendre tout les fraisd de port et soustraire la motié des plus grand fdp. Le montant obtenue sera alors une reduction. Avec cette mmethode c possible?

**jojo57** · 06/06/2007, 11h13

oui non ne tinkiete pas ils seront mis en hidden mais je les ai mis comme ca juste pour moi pendant le devellopement pour que je sache si les frais de port sont les bons...

Tinkiéte pas la mise en page est loin d'être celle ci...

**jojo57** · 06/06/2007, 15h19

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
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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
 
<html>
<head>
 
 
<script language="Javascript">
 
/**Fonction permettant en fonction de la case à cocher de récupèrer le prix correspondant, mettre à jour le total.*/
 
var NbArticles
var Total
var TotalReduc1
var TotalReduc2
var Reduc1
 
var TotalFdp
 
var FrsTrsp = new Array();
function option(ObjRadio)
{
	 NbArticles=0
	 Total=0
	 TotalReduc1=0
	 TotalReduc2=0
	 Reduc1=0
	 TotalFdp=0
 
	var TabRubrique=document.getElementsByTagName('fieldset')
	for(i=0;i<TabRubrique.length;i++)
	{	
 	 	var TabInputs = TabRubrique[i].getElementsByTagName('input');
 	  	var TabRadios = new Array();
 
 	 	for(k=0;k<TabInputs.length;k++){
 	 			if (TabInputs[k].type=='radio')
				{
					TabRadios.push(TabInputs[k]);
				}
 	 	}
 
 		for(j=0;j<TabRadios.length;j++)
		{
 				var reflabel='lbl'+TabRadios[j].id;
		    	if ( (TabRadios[j].checked==true) && (TabRadios[j].value!='0') )
				{ 				
					//alert(reflabel.replace("lblproduit",""));
 
					NbArticles++;
					alert(FrsTrsp[i]);
					TotalFdp+=FrsTrsp[i];
					Total+=Number(TabRadios[j].value);
					TotalReduc1+=Number(TabRadios[j].value);
					TotalReduc2+=Number(TabRadios[j].value);
		    	    document.getElementById(reflabel).style.color='red';
		    	    document.getElementById(reflabel).style.fontWeight='bold';
		    	}
		    	else
				{                       
					document.getElementById(reflabel).style.color='black';
		    		document.getElementById(reflabel).style.fontWeight='normal';
		    	}    		    	                            
		}  
	//réduction suivant le nombre d'articles selectionné	 
	if (NbArticles == 0)
	{
	Reduc2 = 0;
	}
	else if (NbArticles == 1)
	{
	Reduc2 = 1;
	}
	else if (NbArticles == 2)
	{
	Reduc2 = 2;
	}
	else if (NbArticles == 3)
	{
	Reduc2 = 4;
	}
	else if (NbArticles == 4)
	{
	Reduc2 = 6;
	}
 
}
 
document.getElementById('Art').value=NbArticles
document.getElementById('Total').value=Total + " €"
document.getElementById('TotalReduc1').value=(Total - Reduc1) + " €"
document.getElementById('TotalReduc2').value=(TotalReduc1 - Reduc2) + " €"
document.getElementById('fdp').value=TotalFdp
}
 
 
//function option(produit)
{
	//On récupère le nom de la case à cocher.
	//nom = produit.id;
	//On récupère le numéro de la case à cocher en supprimant de la chaine la chaine "produit".
	//num = nom.replace("produit","");
	//On récupère la valeur du champ correspondant au prix de la case à cocher (de l'option choisie).
	//var t = document.getElementsByName("prix"+num);
	//On récupère la valeur en entier du prix correspondant à la case à cocher.
	//var argent = enleveEuroEspace(t[0].value);
	//On récupère le signe euro qui se trouve en fin de champ du prix correspondant à la case à cocher.
	//var euro = t[0].value.substring(t[0].value.length-2,t[0].value.length);
	//On récupère la valeur en entier du champ total de la page.
	//var total = enleveEuroEspace(document.OptionsSelection.Total.value);
	//Si la case à cocher concernée est cocher...
 
	//if (produit.checked==true)
	{
		//On ajoute le total et la valeur du prix correspondant à la cose à cocher (et rajoute l'espace et le sigle euro avec la fonction metEuroEspace).
		//document.OptionsSelection.Total.value=metEuroEspace(total+argent,euro);
	}
	//Sinon...
	//else
	{
		//On soustrait le total et la valeur du prix correspondant à la cose à cocher (et rajoute l'espace et le sigle euro avec la fonction metEuroEspace).
	//	document.OptionsSelection.Total.value=metEuroEspace(total-argent,euro);
	}
 
}
 
/**Fonction permettant d'enlever le signe Euro et les espaces dans la chaine argent.*/
//function enleveEuroEspace(argent)
{
	//On enlève d'abord tous les espaces.
	//argent = argent.replace(" ","");
	//On enlève le dernier caractère qui est forcément le sigle euro.
	//argent =argent.substring(0,argent.length-1);
	//On renvoi le reste convertit en float(pour les prix contenant une ",").
	//return parseFloat(argent);
}
/**Fonction permettant de remettre le signe Euro et les espaces dans la chaine argent.*/
//function metEuroEspace(argent,euro)
{
	//On attache le signe euro à la fin de la variable argent.
	//argent = argent.toString()+euro;
	//return argent;
}
</script>
 
 
 
 
 
<title>Cr&eacute;ation du kit</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
 
<body onLoad="option()">
<form method="post" action="" style="height: 493px" name="OptionsSelection">
<b>Collier&Laisse</b><fieldset id='Collier&Laisse' > <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='16' id='produit94' name='rubrique1' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit94' for='produit94'>Kit chiot nylon</label></td>
				<td align='left'><input size='4' id='prix94' name='prix94' type='text' onFocus='javascript: this.blur()' value='16'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='18' id='produit95' name='rubrique1' checked='checked' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit95' for='produit95' style='color:red; font-weight:bold;'>Kit chiot cuir</label></td>
				<td align='left'><input size='4' id='prix95' name='prix95' type='text' onFocus='javascript: this.blur()' value='18'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='0' id='produit336000624' name='rubrique1' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit336000624' for='produit336000624'>Aucun</label></td>
				<td align='left'><input size='4' id='prix336000624' name='prix336000624' type='text' onFocus='javascript: this.blur()' value='0'/> €</td>  <br style='clear:both;'/></tr></table></fieldset ><br /><b>Croquettes</b><fieldset id='Croquettes' > <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='62' id='produit11054' name='rubrique2' checked='checked' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit11054' for='produit11054' style='color:red; font-weight:bold;'>Nutram chiot - Sac de 15 Kg</label></td>
				<td align='left'><input size='4' id='prix11054' name='prix11054' type='text' onFocus='javascript: this.blur()' value='62'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='52' id='produit111000100' name='rubrique2' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit111000100' for='produit111000100'>Brit chiot - Sac de 15 KG</label></td>
				<td align='left'><input size='4' id='prix111000100' name='prix111000100' type='text' onFocus='javascript: this.blur()' value='52'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='65.9' id='produit11202300' name='rubrique2' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit11202300' for='produit11202300'>Royal Canin Junior Maxi<br>Sac 15 kg</label></td>
				<td align='left'><input size='4' id='prix11202300' name='prix11202300' type='text' onFocus='javascript: this.blur()' value='65.9'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='69.9' id='produit11300200' name='rubrique2' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit11300200' for='produit11300200'>Pro Plan chiot Agneau - Sac de 15 Kg</label></td>
				<td align='left'><input size='4' id='prix11300200' name='prix11300200' type='text' onFocus='javascript: this.blur()' value='69.9'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='0' id='produit336000624' name='rubrique2' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit336000624' for='produit336000624'>Aucun</label></td>
				<td align='left'><input size='4' id='prix336000624' name='prix336000624' type='text' onFocus='javascript: this.blur()' value='0'/> €</td>  <br style='clear:both;'/></tr></table></fieldset ><br /><b>Couchage</b><fieldset id='Couchage' > <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='65' id='produit335500800' name='rubrique3' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit335500800' for='produit335500800'>Corbeille Tenero Taille L</label></td>
				<td align='left'><input size='4' id='prix335500800' name='prix335500800' type='text' onFocus='javascript: this.blur()' value='65'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='119' id='produit335501250' name='rubrique3' checked='checked' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit335501250' for='produit335501250' style='color:red; font-weight:bold;'>Doggielounge Large - Camouflage</label></td>
				<td align='left'><input size='4' id='prix335501250' name='prix335501250' type='text' onFocus='javascript: this.blur()' value='119'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='0' id='produit336000624' name='rubrique3' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit336000624' for='produit336000624'>Aucun</label></td>
				<td align='left'><input size='4' id='prix336000624' name='prix336000624' type='text' onFocus='javascript: this.blur()' value='0'/> €</td>  <br style='clear:both;'/></tr></table></fieldset ><br /><b>Gamelle</b><fieldset id='Gamelle' > <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='15' id='produit51' name='rubrique4' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit51' for='produit51'>Lot de 2 gamelles inox classiques</label></td>
				<td align='left'><input size='4' id='prix51' name='prix51' type='text' onFocus='javascript: this.blur()' value='15'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='25' id='produit50' name='rubrique4' checked='checked' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit50' for='produit50' style='color:red; font-weight:bold;'>Lot de 2 gamelles inox antidérapantes, 2.8 L.</label></td>
				<td align='left'><input size='4' id='prix50' name='prix50' type='text' onFocus='javascript: this.blur()' value='25'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='45' id='produit52' name='rubrique4' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit52' for='produit52'>Lot de 2 gamelles + porte gamelle</label></td>
				<td align='left'><input size='4' id='prix52' name='prix52' type='text' onFocus='javascript: this.blur()' value='45'/> €</td>  <br style='clear:both;'/></tr></table> <table width='80%'  border='0' cellpadding='0' cellspacing='0'><tr><td width='50%'><input type='radio' value='0' id='produit336000624' name='rubrique4' onclick='setTimeout(function(){option()},100);' />
				<label id='lblproduit336000624' for='produit336000624'>Aucun</label></td>
				<td align='left'><input size='4' id='prix336000624' name='prix336000624' type='text' onFocus='javascript: this.blur()' value='0'/> €</td>  <br style='clear:both;'/></tr></table></fieldset ><br /><b>Nombre d'articles : </b><input size='8' id='Art' name='Art' onFocus='javascript: this.blur()' type='text' value=''/><br /><br /><b>Total : </b><input size='8' id='Total' name='Total' onFocus='javascript: this.blur()' type='text' value=''/><br /><br /><b>Total Après réduction : </b><input size='8' id='TotalReduc1' name='TotalReduc1' onFocus='javascript: this.blur()' type='text' value=''/><br /><br /><b>Total Après réduction suivant le nombre d'articles : </b><input size='8' id='TotalReduc2' name='TotalReduc2' onFocus='javascript: this.blur()' type='text' value=''/><br /><br /><b>Total fdp : </b><input size='8' id='fdp' name='fdp' onFocus='javascript: this.blur()' type='text' value=''/>
</form>
 
 
</body>
</html>

Creer un configurateur avec des prix

JavaScript

Vue hybride

Discussions similaires

Partager

Partager