| Autor | Zpráva | ||
|---|---|---|---|
| PetrVB Profil * |
#1 · Zasláno: 10. 9. 2015, 14:17:04
Zkouším rozchodit výpočet ve formuláři. Poslední část <select> se nepřipočítává. Kde dělám chybu? Díky.
<html>
<head>
<title></title>
<script type="text/javascript" language="JavaScript">
function TotalCheckedValues() {
var total = 0;
if(document.F2.a.checked == true) { total += parseFloat(document.F2.a.value); }
if(document.F2.b.checked == true) { total += parseFloat(document.F2.b.value); }
if(document.F2.c.checked == true) { total += parseFloat(document.F2.c.value); }
if(document.F2.d.checked == true) { total += parseFloat(document.F2.d.value); }
if(document.F2.e.checked == true) { total += parseFloat(document.F2.e.value); }
var ts = new String(total);
if(ts.indexOf('.') < 0) { ts += '.00'; }
if(ts.indexOf('.') == (ts.length - 2)) { ts += '0'; }
document.F2.T.value = ts;
}
</script>
</head>
<body>
<form name="F2">
<input type="checkbox" id="a" value="0" onClick="TotalCheckedValues()">Item 1 (Free)<br>
<input type="checkbox" id="b" value="10" onClick="TotalCheckedValues()">Item 2 (10.00)<br>
<input type="checkbox" id="c" value="20" onClick="TotalCheckedValues()">Item 3 (20.00)<br>
<input type="checkbox" id="d" value="30" onClick="TotalCheckedValues()">Item 4 (30)<br>
<select id="e" onClick="TotalCheckedValues()">
<option value="10.00">10</option>
<option value="20.00">20</option>
<option value="30.00">30</option>
</select>
Total: <input type="text" name="T" readonly size="5"> <br>
</form>
</body>
</html> |
||
| tiso Profil |
#2 · Zasláno: 10. 9. 2015, 15:55:37
...
if(document.F2.d.checked == true) { total += parseFloat(document.F2.d.value); }
total += parseFloat(document.F2.e.value);
...
<body onload="TotalCheckedValues()">
...
<select id="e" name="e" onClick="TotalCheckedValues()">
... |
||
|
Časová prodleva: 12 dní
|
|||
| PetrVB Profil * |
#3 · Zasláno: 22. 9. 2015, 22:27:01
Super. Funguje to. Díky.
Jde nastavit aby mi přišel zvolený počet kusů a ne hodnota value? <select id="e" onClick="TotalCheckedValues()"> <option value="10.00">1 ks</option> <option value="20.00">2 ks</option> <option value="30.00">3 ks</option> </select> Díky |
||
| tiso Profil |
#4 · Zasláno: 22. 9. 2015, 23:30:04
PetrVB:
„Jde nastavit aby mi přišel zvolený počet kusů a ne hodnota value?“ Tak si do option value ukladaj kusy a cenu si ulož do iného atribútu: <option value="1" data-price="10.00">1 ks</option>
...
total += parseFloat(document.F2.e.getAtribute('data-price')); |
||
|
Časová prodleva: 20 dní
|
|||
| PetrVB Profil * |
#5 · Zasláno: 13. 10. 2015, 11:15:52
Sorry, ale nedaří se mi to rozeběhnout.
<html>
<head>
<title></title>
<script type="text/javascript" language="JavaScript">
function pricebox() {
var total = 0;
total += parseFloat(document.F2.e.getAtribute('data-price'));
var ts = new String(total);
if(ts.indexOf('.') < 0) { ts += '.00'; }
if(ts.indexOf('.') == (ts.length - 2)) { ts += '0'; }
document.F2.T.getAtribute('data-price') = ts;
}
</script>
</head>
<body>
<form name="F2">
<select id="e" name="e" onClick="pricebox()">
<option value="0">----</option>
<option value="1" data-price="10.00">1 ks</option>
<option value="2" data-price="20.00">2 ks</option>
</select>
<br>
<input type="text" name="T" readonly size="10"> <br>
</form>
</body>
</html>Díky za pomoc. |
||
| tiso Profil |
#6 · Zasláno: 13. 10. 2015, 12:14:28
PetrVB: sorry, máš pravdu, toto nemohlo fungovať, ten atribút je na option a nie na select
function pricebox() {
var total = 0;
var value = document.F2.e.value;
if (value > 0) {
var options = document.F2.e.children;
for (key in options) {
if (options[key].value == value) {
total += parseFloat(options[key].getAttribute('data-price'));
break;
}
}
}
var ts = new String(total);
if(ts.indexOf('.') < 0) { ts += '.00'; }
if(ts.indexOf('.') == (ts.length - 2)) { ts += '0'; }
document.F2.T.value = ts;
} |
||
| juriad Profil |
#7 · Zasláno: 13. 10. 2015, 12:18:36
řádky 14 - 16 lze nahradit za volání metody
total.toFixed(2).
|
||
| PetrVB Profil * |
#8 · Zasláno: 13. 10. 2015, 23:03:57
Díky moc! Můžu ještě jednou prudit? Pro případ, že bych do formuláře někdy potřeboval doplnit radio a checkbox, které budou taky počítat cenu jak by měl javascript vypadat?
Ještě jednou díky. Tohle sám nedám. <form name="F2"> <select id="e" name="e" onClick="pricebox()"> <option value="0">----</option> <option value="1" data-price="10.00">1 ks</option> <option value="2" data-price="20.00">2 ks</option> </select> <br> <input type="checkbox" id="f" name="f" value="1" data-price="30.00" onClick="pricebox()">30.00 <br> <input type="radio" name="xyz" id="g" value="1" data-price="40.00" onClick="pricebox()">40.00 <br> <input type="text" name="T" readonly size="10"><br> </form> |
||
|
Časová prodleva: 13 dní
|
|||
| PetrVB Profil * |
#9 · Zasláno: 26. 10. 2015, 13:22:41
Zdravím, chtěl bych požádat o pomoc a úpravu javascriptu tak aby to fungovalo i pokud se do formuláře přidá checkbox a radio. Předem díky za pomoc.
<html>
<head>
<title></title>
<script type="text/javascript" language="JavaScript">
function pricebox() {
var total = 0;
var value = document.F2.e.value;
if (value > 0) {
var options = document.F2.e.children;
for (key in options) {
if (options[key].value == value) {
total += parseFloat(options[key].getAttribute('data-price'));
break;
}
}
}
var ts = new String(total);
if(ts.indexOf('.') < 0) { ts += '.00'; }
if(ts.indexOf('.') == (ts.length - 2)) { ts += '0'; }
document.F2.T.value = ts;
}
</script>
</head>
<body>
<form name="F2">
<select id="e" name="e" onClick="pricebox()">
<option value="0">----</option>
<option value="1" data-price="10.00">1 ks</option>
<option value="2" data-price="20.00">2 ks</option>
</select>
<br>
<input type="checkbox" id="f" name="f" value="1" data-price="30.00" onClick="pricebox()">30.00
<br>
<input type="checkbox" id="f" name="f" value="1" data-price="40.00" onClick="pricebox()">40.00
<br>
<input type="radio" name="xyz" id="g" value="1" data-price="50.00" onClick="pricebox()">50.00
<br>
<input type="radio" name="xyz" id="g" value="1" data-price="60.00" onClick="pricebox()">60.00
<br>
<input type="text" name="T" readonly size="10"><br>
</form>
</body>
</html> |
||
| anonymníí Profil * |
#10 · Zasláno: 27. 10. 2015, 07:42:16
PetrVB:
A kde máš konkrétně problém? V JS žádnou snahu o práci s těmi checkboxi nevidím, přitom princip je podobný, dokonce je to jednodušší - odpadne for smyčka pro zjištění ceny.
- ID musí býtv dokumentu unikátní, u checkboxů musí být unikátní i name (jinak nevíš, který je zaškrtnutý) - zaškrtnutý ckeckbox se dá v JS zjistit pomocí .checked
- vybrané rádio také pomocí .checked
- nezapomínej, že se checkbox i radio (a nakonec i ze selectu) dá vybrat jinak než jen kliknutím. Pokud budu pracovat s klávesnicí, výpočet se nevykoná, nedojde k události onlick.
|
||
| PetrVB Profil * |
#11 · Zasláno: 27. 10. 2015, 10:48:04
O.k. Díky za na vedení. Zkusím to upravit.
|
||
| Chamurappi Profil |
#12 · Zasláno: 27. 10. 2015, 14:49:58
Reaguji na anonymníího:
„Pokud budu pracovat s klávesnicí, výpočet se nevykoná, nedojde k události onclick.“
Ale dojde, onclick je výchozí akční událost.
|
||
| Str4wberry Profil |
#13 · Zasláno: 27. 10. 2015, 14:58:45
(Jak funguje
onclick u různých elementů při ovládání klávesnicí, jsem před časem testoval tady: Událost onclick na různých elementech)
|
||
| Chamurappi Profil |
#14 · Zasláno: 27. 10. 2015, 15:19:52
Reaguji na Str4wberryho:
Ještě bys mohl prozkoumat vliv atributu disabled. Minimálně v některých případech pak onclick nejde vyvolat ani kliknutím, což může překvapit.
|
||
| anonymnii Profil * |
#15 · Zasláno: 27. 10. 2015, 15:48:41
Ch.+strawberry: díky, to jsem nevěděl. Omlouvám se za unahlenou reakci bez patricneho prověření.
|
||
|
Časová prodleva: 11 let
|
|||
0