8791 sujets

Développement web côté serveur, CMS

Probleme scripte devis en ligne

Bonjour à tous, j'ai crée un sciprt en java pour afficher des prix en fonction de liste déroulantes liées et bouton radio.
Le voici
<script language="javascript">
var cat, sel, tab;

 
function Affiche_liste(id_ensemble_select,id_select){
	sel=document.getElementById(id_ensemble_select);
	cat=id_select;
	tab = sel.getElementsByTagName("select");
 
	for (i=0; i < tab.length; i++){
		tab[i].disabled = true;
		tab[i].style.display = 'none';
	}
 
	document.getElementById(cat).disabled = false;
	document.getElementById(cat).style.display = 'inline'; 
 
}

function calcul(total,categorie,tva)
{ // on se limite à une quantité avec un taux de TVA et des frais de port

x=document.getElementById(cat);;c=(1*x.value);// quantite
x=document.getElementById(tva);t=(1*x.value); // le taux de TVA


// les frais de port (boucle car bouton radio)
for(i=0;i<document.frm.port.length;i++){
   if(document.frm.port[i].checked){f=(1*document.frm.port[i].value);}
 
}
r=(c*(1+(t/100)))+f; //On calcule
x=document.getElementById(total);x.value=r; // On affecte
Math.round(total*1000)/1000	
}
</script>

Le HTML

<html>
<head>
</head>
<body>

<form name="frm">
<p class="titre">Calcul Prix</p>
<fieldset id="calculprix">
  
<label>PRODUIT : </label>
<p><label for="choix_visites">Carte de visites (84x55mm)</label>
<input type="radio" id = "choix_visites" name = "cat" value = "visites" class = "categorie" tabindex="0" onclick = "Affiche_liste(this.className,this.value)" input checked="hidden" />    
<p><label for="choix_fairepart">Faire part(148x105mm)</label>    
<input type="radio" id = "choix_fairepart" name = "cat" value = "part" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" /></p>

<p><label for="choix_correspondance">Carte de correspondance (210x99mm)</label>
<input type="radio" id = "choix_correspondance" name = "cat" value = "corres" class = "categorie" onclick = "Affiche_liste(this.className,this.value)" />
</select></p>
</p>

</p>

<p id = "categorie">
<label>QUANTITE </label>
<select name = "selection" id = "visites" onBlur="calcul('total','categorie','tva')" style="display: inline: none;">
    <option value=>choisissez</option>
	<option value="59">100</option>
	<option value="61">200</option>
	<option value="69">500</option>
    <option value="79">1000</option>
    <option value="91">2000</option>
    <option value="138">5000</option>
    <option value="199">10 000</option>
    <option value="">+10 000 - Nous consulter</option>
</select>

<select name = "selection" id = "part" style="display: none; " disabled="" onBlur="calcul('total','categorie','tva')">
    <option value=>choisissez</option>
	<option value="66">100</option>
	<option value="69">200</option>
	<option value="78">500</option>
    <option value="88">1000</option>
    <option value="109">2000</option>
    <option value="179">5000</option>
    <option value="281">10 000</option>
    <option value="">+10 000 - Nous consulter</option>
</select>


<select name = "selection" id = "corres" style="display: none; " disabled="" onBlur="calcul('total','categorie','tva')">
    <option value=>choisissez</option>
	<option value="69">100</option>
	<option value="76">200</option>
	<option value="82">500</option>
    <option value="94">1000</option>
    <option value="118">2000</option>
    <option value="199">5000</option>
    <option value="322">10 000</option>
     <option value=""class="style1">+10 000 - Nous consulter</option>
</select>
</p>

<P><label for="TVA">TVA :</label><select name="tva" id="tva" onChange="calcul('total','categorie','tva')">
<option value="0" selected>HT</option>
<option value="19.6">19,6%</option>
</select>
</p>

<p><label for="Frais de port">FRAIS DE PORT :</label>
<input id="port" type="radio" name="port" value="0" onClic="calcul('total','categorie','tva')" class="style2" checked> <label for="retrait sur place">Retrait sur place</label>
<input id="port" type="radio" name="port" value="11" onClick="calcul('total','categorie','tva')"class="style2"><label for="Collissimo">Collissimo</label></p>
</fieldset>

<p class="titre">Prix</p>
<fieldset id="titreprix">
<label for="total">Total :</label><input id="total" type="text" name="total"  readonly tabindex="1" VALUE="Cliquer ici" STYLE="width=100">
</br></fieldset></body>
</html>


Le CSS
p.titre {
  font-family:'orbitron',"verdana",sans-serif;
  background:#19afc9;/* Couleur fond cadre */
  color:#ffffff;
  padding:.2em .3em;
  font-size:1.2em;
  border:2px outset #19afc9;
  position:relative;
  margin-bottom:-1em; /*marge de bas négative, ce qui fait que le titre viendra s'encastrer dans l'elément en-dessous */
  width:10em;
  margin-left:1em;
  margin-top:1em;
  padding:.2em .3em;
}

fieldset {
  border:none;
  margin-bottom:1em;
  width:30em;
  padding-top:1.5em;
  
}

select {
  position:absolute;
  margin-left:9em;/*Decalage liste déroulant vers la droite*/
  margin-bottom:0;
}


/* fieldset Calcul prix */
fieldset#calculprix {
  background:#e7e6e2;
  border:outset #A4D8EE;
}
/* fieldset prix */
fieldset#titreprix {
  background:#e7e6e2;
  border:outset #A4D8EE;
}

#titrePrix label {
  position:absolute;
  font-size:90%;
  padding-top:.2em;
  left:20px;
}

#titrePrix input {/*Decalage case affichage totalvers la droite*/
  margin-left:9em;
  line-height:1.4em;
  margin-bottom:.2em;
}

/* fieldset message */
fieldset#titretotal {
  background:#e7e6e2;
  border:outset #9DF2CE;
}
#total {
  font-size:90%;
}
#total input {
  margin-left:9em;
}

#total input + input {
  margin-left:1em;
}

/* cases a cocher */
#cat {
   font-size:90%;
}
#cat input {
   margin-left:9em;
}
#cat input +input {
   margin-left:1em;
}
#cat br+input {
  margin-left:9em;
}


Il fonctionne mais correctement. Par défaut c'est le premier bouton radio 'carte de visite' qui est coché. Mais pour avoir le prix il faut que je coche l'un des deux autres et que je revienne dessus après.
Même chose pour le choix de l'envoi il ne s'additionne pas tout de suite. Il faut faire des allez et retour pour que le calcul se fasse.

Quelqu'un voie ce qui ne va pas ?
[/i][/i][/i][/i]
Modérateur
a écrit :
j'ai crée un sciprt en java

J'ai trouvé l'erreur, ce n'est pas du java, mais du javascript!

a écrit :
Il fonctionne mais correctement

Mince! Faut vite ajouter des bugs! Smiley biggrin

Sinon ton événement qui déclenche tes calculs sur les boutons radio est un onclick. Fatalement il ne se passe rien tant qu'on ne clique pas... Il faut lancer ton code à la fin du chargement de la page.
Bonjour, merci pour ton élément de réponse. Pour le premier bouton radio j'ai changé le onclick par onload. Mais mon calcul ne se fait toujours pas.
Modérateur
non, il ne fallait pas changer le onclick, mais ajouter un onload, et pas sur le input:


<script type="text/javascript">
  window.onload = function() {
    // ici tu trouves le radio sélectionné et tu lances
   affiche_liste('bidule','chouette');
  };
</script>
Désolée d'être si nul mais voilà ce que j'ai mis. Et ça ne fonctionne pas.
<script type="text/javascript">

  window.onload = function() {

    Affiche_liste(this.className,this.value);

  };

var cat, sel, tab;

 
function Affiche_liste(id_ensemble_select,id_select){
	sel=document.getElementById(id_ensemble_select);
	cat=id_select;
	tab = sel.getElementsByTagName("select");
 
	for (i=0; i < tab.length; i++){
		tab[i].disabled = true;
		tab[i].style.display = 'none';
	}
 
	document.getElementById(cat).disabled = false;
	document.getElementById(cat).style.display = 'inline'; 
 
}

function calcul(total,categorie,tva)
{ // on se limite à une quantité avec un taux de TVA et des frais de port

x=document.getElementById(cat);;c=(1*x.value);// quantite
x=document.getElementById(tva);t=(1*x.value); // le taux de TVA


// les frais de port (boucle car bouton radio)
for(i=0;i<document.frm.port.length;i++){
   if(document.frm.port[i].checked){f=(1*document.frm.port[i].value);}
 
}
r=(c*(1+(t/100)))+f; //On calcule
x=document.getElementById(total);x.value=r; // On affecte
Math.round(total*1000)/1000	
}



</script>
[/i][/i][/i][/i]
Sujet clos
Aller à