Kontrollera input med onblur
Har ett litet enkelt formulär som ska räkna ut lite grejer och jag skulle behöva något sätt att kontrollera vad man skrivit in i formulären.
Det fungerar just nu men det blir inte så snyggt och det är inte helt rätt.Metoden onblur borde kunna fungera för det jag tänkt mig tror jag?
Anyway, jag har en funktion som ser ut såhär;
function calcSVT() {
var tid = document.getElementById('time').value;
var strecka = document.getElementById('distance').value;
var hastighet = document.getElementById('speed').value;
if (checkInput(strecka) == true && checkInput(tid) == true) {
//sträcka och tid ifyllt, räkna ut hastigheten
document.getElementById('speed').value = setMaxTwoDecimals(strecka / tid);
}
else if (checkInput(tid) == true && checkInput(hastighet) == true) {
//tid och hastighet är ifyllt, räkna ut sträcka
document.getElementById('distance').value = setMaxTwoDecimals(hastighet * tid);
}
else if (checkInput(hastighet) == true && checkInput(strecka) == true) {
//hastighet och sträcka är ifyllt, räkna ut tid
document.getElementById('time').value = setMaxTwoDecimals(strecka / hastighet);
}
else {
alert("Du måste fylla i två värden för att kunna räkna ut det tredje.");
}
}
Samt en "checkinput" som ser ut såhär;
function checkInput(tal) {
if (tal.indexOf(",") > -1) {
alert("Vänligen använd . istället för ,");
return false;
}
// Kollar om fältet är ifyllt och sätter värdet till true om length är större än 0. Sätter annars till false.
if (tal.length> 0) {
return true;
}
else {
return false;
}
}
I HTML-koden ser det ut såhär;
<div id="formcontainer">
<div class="svt">
<span>Sträcka</span>
<input id="distance" type="text"/>
<span>(kilometer)</span>
<br/>
<br/>
<span>Tid</span>
<input id="time" type="text"/>
<span>(timmar)</span>
<br/>
<br/>
<span>Hastighet</span>
<input id="speed" type="text"/>
<span>(km/h)</span>
</div>
<br/>
<br/>
<input type="button" onclick="calcSVT()" value="Räkna ut" />
</div>
Så.. då är frågan, hur ska man kunna använda onblur här för att få det att fungera? Onblur måste ju anropa checkinput-funktionen efter varje textfält och kolla så att det blir ett true, hur man ska få till det i praktiken vet jag inte riktigt och tänkte att någon kanske hade någon idé
Som det är nu så får man ju upp två stycken alerts om att man måste använda . istället för , och en alert som säger "Du måste fylla i två värden för att kunna räkna ut det tredje" när man skrivet ett kommatecken. Det ska bara finnas en alert är det tänkt.