Forum PHP.pl > [JS] checkbox + dodawanie-odejmowanie ceny

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JS] checkbox + dodawanie-odejmowanie ceny

Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript

termin

24.01.2008, 13:44:11

Witam, siedzę już nad jedną rzeczą pół dnia i kompbinuję i jak narazie bez rezultatów. Otóż, chcę zrobić coś takiego, że mam na stronie wyświetloną cene produktu np: samochód: 100zł, do tego samochodu można dołożyć pozdespoły dodatkowe np. koła zapasowe: 50zł, amortyzatory: 30zł, antenę: 10zł - produktów dodatkowych moze być więcej, w zależności od rodzaju samochodu. Chcę aby na stronie była cena "razem do zapłaty", ale moze ona być zmieniana dynamicznie po zaznaczeniu jakiegoś checkbox-a w elementach dodatkowych. Czyli podsumowując: wchodze na strone to widać 100zł, ale zaznaczam checkbox przy kołach zapasowych, to cena automatycznie zmienia się na 150zł itd. Ktoś moze mnie naprowadzić jak to ugryźć?

vokiel

24.01.2008, 13:54:27

A kombinowałeś już coś sam? To pokaż, będzie nam łatwiej

1. Do każdego checkboxa dodaj zdarzenie onclick które wywoła funkcje js
2. ta sprawdzi co zostalo klikniete, obliczy wartosc
3. wpisze (innerHTML) cene w odpowiedni element (p, span, div)

mike

24.01.2008, 13:56:18

"proste ale nie dla mnie" - co to za głupi tytuł wątku?
Proszę poprawić (wskazówki dot. formułowania tytułów są w Regulaminie forum) inaczej wątek pójdzie do kosza.

dassystem

18.12.2008, 21:00:10

Może komuś się kiedys przyda

[HTML] pobierz, plaintext 
<html>
<head>
 
<script type="text/javascript">
 
function licz()
{
    var id_checkboxa=[];
    var cena=[];
    var suma=0;
    suma = parseFloat(suma);
 
    id_checkboxa=document.getElementsByName("ch1");
    cena=document.getElementsByName("ch3");
 
    for(var i=0;i<id_checkboxa.length ;i++)
    {
 
      if(id_checkboxa[i].type=='checkbox' && id_checkboxa[i].checked==true)
      {
         cena_float = parseFloat(cena[i].value);  
         suma = suma + cena_float;     
      }
 
	   if (suma <0) {suma = 0;}
	   if (i == id_checkboxa.length-1)
	   {
     	        document.getElementById("wynik").value=suma;
	   }
    }
 
}
 
</script>
 
</head>
<body>
 
<form method='post' id='f1'>
 
<p><label>1</label><input type='checkbox' name="ch1" onclick="licz()" />
		   <input type='hidden' name="ch3" value='10' /></p>
 
<p><label>2</label><input type='checkbox' name="ch1" onclick="licz()" />
		   <input type='hidden' name="ch3" value='10' /></p>
 
<p><label>3</label><input type='checkbox' name="ch1" onclick="licz()" />
		   <input type='hidden' name="ch3" value='10' /></p>
 
<p><label>4</label><input type='checkbox' name="ch1" onclick="licz()" />
		   <input type='hidden' name="ch3" value='10' /></p>
 
<p><label>5</label><input type='checkbox'  name="ch1" onclick="licz()" />
		   <input type='hidden' name="ch3" value='10' /></p>
 
 
<p><label>SUMA</label><input type='text' id="wynik" /></p>
</form>
 
</body>
</html>
[HTML] pobierz, plaintext

DannyM

15.05.2009, 13:35:20

to moze powiecie mi jak prosto wykonac takie dzialanie?

[HTML] pobierz, plaintext 
<p>liczba
  <input type="text" name="liczba" id="liczba" onchange="licz()"/>
</p>
<p>stala
  <input name="stala" type="text" id="stala" value="10" />
</p>
<p>wynik
  <input type="text" name="wynik" id="wynik" />
</p>
<script type="text/javascript">
 
 
function licz(){
var wynik = document.getElementById('liczba').value+document.getElementById('stala').value;
document.getElementById('wynik').value=wynik;
}
</script>
[HTML] pobierz, plaintext

dodaje "liczba" do "stala" i suma jest w polu "wynik".
Wiele ludzi ma problemy z dodawaniem. Niby to proste ale dla mnie JS to zagadka

Odejmowanie jest ok a z dodawaniem zawsze problem. Troche to dla mnie bez sensu bo skoro mozna bylo zrobic odejmowanie czemu nie dodawanie.

nexis

15.05.2009, 14:15:29

Bo + to również operator łączący ciągi tekstowe. Musisz to zrobić tak:

Kod

function licz() {
    var liczba  = parseInt(document.getElementById("liczba").value);
    var stala   = parseInt(document.getElementById("stala").value);
    var wynik   = document.getElementById("wynik");
    wynik.value = liczba + stala;
}

DannyM

15.05.2009, 14:17:51

Super o to chodziło. Dzięki za wyjaśnienie.
Chetnie klikne "Pomogł" ale nie dziala klawisz

rysiopych

18.12.2009, 16:36:27

A co muszę zmienić, żeby pole formularza było typu mieszanego:
np część pól typu radio, a część checkbox?
Chodzi mi o to, aby użytkownik najpierw wybrał grupę produktów, a potem spośród tej grupy produkt.
Np: konfigurator pizzy - najpierw wybieramy rozmiar a potem składniki (których cena jest zależna od wcześniej wybranej wielkości).
Proszę o pomoc. Próbowałem zmodyfikować skrypt, który napisał dassystem, ale nie osiągnąłem celu ;\
Pozdrawiam

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.