[JavaScript]Dodawanie liczb. Opcje

[cykcykacz]

Hej,
właśnie poznaje javascript i mam taki problem ten kod, wyświetli mi ładnie liczby:

CODE

function updateOrder() {
const TAXRATE = 0.07;
const DONUTPRICE = 1.10;
var numCakeDonuts = document.getElementById("cakedonuts").value;
var numGlazedDonuts = document.getElementById("glazeddonuts").value;
var subTotal = (numCakeDonuts + numGlazedDonuts) * DONUTPRICE;
var tax = subTotal * TAXRATE;
var total = subTotal + tax;
document.getElementById("subtotal").value = subTotal.toFixed(2) + " PLN";
document.getElementById("tax").value = tax.toFixed(2) + " PLN";
document.getElementById("total").value = total.toFixed(2) + " PLN";
}

<form name="orderform" action="donuts.php" method="POST">
<div class="field">
Personalia: <input type="text" id="name" name="name" value="" />
</div>
<div class="field">
Liczba pączków z nadzieniem: <input type="text" id="cakedonuts" name="cakedonuts" value="" onchange="updateOrder();" />
</div>
<div class="field">
Liczba pączków z lukrem: <input type="text" id="glazeddonuts" name="glazeddonuts" value=""
onchange="updateOrder();" />
</div>
<div class="field">
Za ile minut odbiór: <input type="text" id="pickupminutes" name="pickupminutes" value="" />
</div>
<div class="field">
Suma częściowa: <input type="text" id="subtotal" name="subtotal" value="" readonly="readonly" />
</div>
<div class="field">
Podatek: <input type="text" id="tax" name="tax" value="" readonly="readonly" />
</div>
<div class="field">
Wartość sumaryczna: <input type="text" id="total" name="total" value="" readonly="readonly" />
</div>
<div class="field">
<input type="button" value="Złóż zamówienie" onclick="placeOrder(this.form);" />
</div>
</form>

Natomiast ten kod przy dodawaniu zrobi konkatencje. Nie wiem dlaczego? Mogę dodać funkcję "parseFloat" która załatwi sprawę ale nie wiem dlaczego robi tą konkatencje przy dodawaniu?:

CODE

function get() {
const x = 1;
var a = document.getElementById("liczba1").value;
var b = document.getElementById("liczba2").value;
var dodawanie =a+b * x;
var mnozenie =a*b * x;

document.getElementById("dodawanie").value = dodawanie.toFixed(2) + " PLN";
document.getElementById("mnozenie").value = mnozenie + " PLN";
}

<form name="liczby">
Liczba a:<input type="text" id="liczba1" name="liczba1" value="" onchange="get()" />
<br />
Liczba b:<input type="text" id="liczba2" name="liczba2" value="" onchange="get()" />
<br />
Wynik +<input type="text" id="dodawanie" name="dodawanie" value="" readonly="readonly" />
<br />
Wynik *<input type="text" id="mnozenie" name="mnozenie" value="" readonly="readonly" />
<br />
<input type="submit" value="click me!" />
</form>

Ten post edytował cykcykacz 20.01.2013, 20:13:38

[skowron-line]

Bo z pola pobierasz stringa więc musisz go na liczbę przerobić
parseInt
parseFloat

[cykcykacz]

No tak ale dlaczego w pierwszym kodzie idzie to prawidło a tam nie ma?
parseInt
parseFloat

Ten post edytował cykcykacz 20.01.2013, 20:21:50

[skowron-line]

A zmień stałą z int na floata.

[kamil4u]

W pierwszym kodzie nie jest prawidłowo. Dodawanie odbywa się źle(1). Dopiero drugie dodawanie(2) działa poprawnie, gdyż wtedy otrzymujemy już liczby.

1. (numCakeDonuts + numGlazedDonuts) * DONUTPRICE;
2. subTotal + tax


Gdy mnożymy liczbę z stringiem wynik automatycznie jest konwertowany na liczbę.

--edit--
Pobaw się z type of i alert. Posprawdzaj co kiedy jest liczbą, string-iem. Wtedy zapamiętasz na całe życie:)

Ten post edytował kamil4u 20.01.2013, 20:35:32