Vælg mellem 2 små formularer på samme plads ved brug af en afkrydsningsboks
Jeg kunne godt bruge lidt hjælp til følgende, Jeg tror det kan lade sig gøre, men jeg er for urutineret til at kunne se løsningen.Jeg har lavet et lille eksempel i 2 billeder (kan desværre ikke vise dem her. Men de er næsten identiske). Formularens programmering vises nederst.
Øverst 2 checkbokse, der styrer valget af formularen. Herunder selve formen med ganske få ændringer. Formene er også næsten identisk. (form er undladt, da det ingen betydning har, jeg har ikke fundet nogen).
Krav til løsningen:
* Formene skal være på samme plads. (kan evt. bruge samme form til begge dog med få ændringer i labelen.
* De skal vælges ud fra 2 checkbokse eller lignende (radiobokse)
* De skal lave den aritmetiske beregning
* Den skal lave beregningen ud fra en indtastning i km eller timer
Håber der er en der kan hjælpe mig.
Form 1:
<Html>
<head>
<meta charset="utf-8">
<script>
function PrisIalt(){
var antal = document.getElementById("antal").value;
var antal = parseFloat(antal);
var pris = document.getElementById("pris").value;
var pris = parseFloat(pris);
var total = antal * pris;
document.getElementById("total").value = Math.ceil(total);
}
</script>
<style>
input.larger {
width:25px;
height:25px;
}
</style>
</head>
<body>
<br><br>
<input type="checkbox" class="larger" name="checkBox1" checked>
<label>Km</label>
<input type="checkbox" class="larger" name="checkBox2" >
<label>Tid</label>
<br><br>
<label for="antal">Kilom:</label>
<input type="number" id="antal" name="antal" dir="rtl" value="">
<label for="pris">Kr/km:</label>
<input type="number" id="pris" name="pris" readonly="readonly" dir="rtl"
value="3.5">
<label for="total">Pris Ialt kr.:</label>
<input type="number" id="total" name="total" readonly="readonly" dir="rtl" value="">
</body>
</html>
Form 2:
<html>
<head>
<script>
function PrisIalt(){
var antal = document.getElementById("antal").value;
var antal = parseFloat(antal);
var pris = document.getElementById("pris").value;
var pris = parseFloat(pris);
var total = antal * pris;
document.getElementById("total").value = Math.ceil(total);
}
</script>
<style>
input.larger {
width:25px;
height:25px;
}
</style>
</head>
<body>
<br><br>
<input type="checkbox" class="larger" name="checkBox1" >
<label>Km</label>
<input type="checkbox" class="larger" name="checkBox2" checked>
<label>Tid</label>
<br><br>
<label for="antal">Timer:</label>
<input type="number" id="antal" name="antal" dir="rtl" value="">
<label for="pris">Kr/tm:</label>
<input type="number" id="pris" name="pris" readonly="readonly" dir="rtl"
value="3.5">
<label for="total">Pris Ialt kr.:</label>
<input type="number" id="total" name="total" readonly="readonly" dir="rtl" value="">
</body>
</html>
