Kodları lütfen aşağıdaki butonları kullanarak renklendirin. Örnek: <php> echo "Selam Dünya"; </php>
Yardım
karakter kaldı

Ajax - Javascript ile chech box ya da select seçildiğinde tutarı değiştirmek

<head>
<title>sd</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<script>
function topla(){
str=0;
document.getElementById("toplam2").innerHTML = str;

for(var x=0; x<document.form1.elements["topla[]"].length; x++)
	{
		if(document.form1.elements["topla[]"][x].checked==true )
			{ str = str + Number(document.form1.elements["topla[]"][x].value); }
	}


document.getElementById("toplam2").innerHTML=str;

document.getElementById("toplam").innerHTML = Number(document.getElementById("adet").innerHTML) * (Number(str));

document.getElementById("toplam").innerHTML = Number(document.getElementById("adet").innerHTML) * (Number(document.getElementById("toplam2").innerHTML) + Number(document.getElementById("toplam3").innerHTML));



}

function carp(adet){
str=document.getElementById("adet").innerHTML;

document.getElementById("adet").innerHTML =  adet;
document.getElementById("toplam").innerHTML =  adet * NumbeR(document.getElementById("toplam2").innerHTML);
}



function topla3(deger){
str=document.getElementById("toplam2").innerHTML;

document.getElementById("toplam3").innerHTML=Number(deger);


document.getElementById("toplam").innerHTML = Number(document.getElementById("adet").innerHTML) * ( Number(deger) + Number(document.getElementById("toplam3").innerHTML) );


}
</script>


<form name="form1" id="form1" action="df.html">

Adet: 
<select name="carp[]" onchange="carp(this.value)">

  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>

</select><br /><br />

Seçenek1:<br />
<select name="topla3[]" onchange="topla3(this.value)">

  <option value="1">1 Lira</option>
  <option value="2">2 Lira</option>
  <option value="3">3 Lira</option>
  <option value="4">4 Lira</option>
  <option value="5">5 Lira</option>

</select>
<br><br>

Seçenek2:<br />
<select name="topla3[]" onchange="topla3(this.value)">

  <option value="1">1 Lira</option>
  <option value="2">2 Lira</option>
  <option value="3">3 Lira</option>
  <option value="4">4 Lira</option>
  <option value="5">5 Lira</option>

</select>
<br><br>

Seçimler 1<br />
<input type="checkbox" name="topla[]" value="9" onclick="topla( )"/>9<br />
<input type="checkbox" name="topla[]" value="12" onclick="topla( )"/>12 <br />
<input type="checkbox" name="topla[]" value="8" onclick="topla( )"/>8 <br /> <br />

Seçimler 2<br />
<input type="checkbox" name="topla[]" value="9" onclick="topla( )"/>3<br />
<input type="checkbox" name="topla[]" value="12" onclick="topla( )"/>15 <br />
<input type="checkbox" name="topla[]" value="8" onclick="topla( )"/>4 <br /> <br />


<label>Toplam: </label> 
	<span style="visibility: hidden;" id="adet">1</span>
	<span style="visibility: display;" id="toplam2">0</span>
	<span style="visibility: display;" id="toplam3">0</span>
	<span id="toplam">50</span> 
</form>
</body>


Yukarıdaki gibi bir deneme yaptım ancak birden fazla select ve check box grubu olan bir form içerisinde, tutarın bu seçimlere göre değişmesini istiyorum.

Bu istediğim sonuca nasıl ulaşabilirim acaba?
+0
-0
Cevaba KatılıyorumKatılmıyorum
Cevap Yaz Yorum Yaz Arşivime Ekle Takip Et

Cevaplar

  • etkiweb adlı üyenin fotoğrafı
    9 yıl önce yazılmış
    19 cevap - 19 soru
    Öncelikle Fiyat Atamamız Gerek.
    <input type="hidden" id="f_fiyat" name="f_fiyat" value="3.50">


    Sonra selectboxu yazdıralım.
    <select name="adett" id="adett" onChange="Hesapla();">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="2">3</option>
    </select>
    


    <div class="fiyat" id="sonuclan">3.50 TL</div>


    
    <script>
    	var fiyat = document.getElementById("f_fiyat").value;
    	var sel = document.getElementById("adett");
    
    	
    	function Hesapla(){
    		var sonuc = sel.options[sel.selectedIndex].value * fiyat;
    		document.getElementById("sonuclan").innerHTML = sonuc + " TL";
    	}
    </script>