---
title: "onChange -> validate"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/74854-onchange-validate"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "ironhead"
published: "2003-04-24T09:13:45.000Z"
updated: "2003-04-29T10:49:42.000Z"
replies: 21
views: 444
page: 1
pages: 2
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/74854-onchange-validate"
---

# onChange -> validate

_Sida 1 av 2._

## #1 — ironhead, 2003-04-24T09:13Z

har 3 st inputrutor...

\<INPUT TYPE="text" name=pub_year VALUE="" size="4" maxlength="4"\>
\<INPUT TYPE="text" name=pub_month VALUE="" size="2" maxlength="2"\>
\<INPUT TYPE="text" name=pub_day VALUE="" size="2" maxlength="2"\>

...nu skulle jag vilja validera att år, mån & dag är i rätt format (ex: 2003-04-24)....så när man flyttar sig från tex månads-rutan, så kollar den att månaderna är emellan 1-12 och att det är siffror..ska man använda onChange då? och hur flyttar man värdet i input-rutan till funktionen....

TEST:
 \<script language="JavaScript" type="text/javascript"\>
function chkMonth(pub_month){
if (isInteger (pub_month)) 
{
		if ((pub_month \< 1) \|\| (pub_month \> 12))
		{
			document.write ("Fel");
		}
}
}
\</script\>

\<INPUT TYPE="text" name=pub_month VALUE="" size="2" maxlength="2" onChange="chkMonth(this);"\>

Rätt eller fel?!

Permalänk: https://www.webforum.nu/p/74854

## #2 — ironhead, 2003-04-24T11:14Z

Har gjort såhär nu:

function chkMonth(){

if ((document.dat.pub_month.value \< 1) \|\| (document.dat.pub_month.value \> 12)) {
		alert("Du måste fylla i en giltig månad (01-12).");
		return false;
		}
		
if (document.dat.pub_month.value.length \< 2){
		alert("Du måste ange minst 2 siffror (ex.02 för Februari)");
		return false;
}		 

if (isInteger (document.dat.pub_month.value)){
		}else{
		 alert("Endast siffror får anges.");
		 return false;
}

}

...för månad....

och i input:

\<INPUT TYPE="text" name=pub_month VALUE="" size="2" maxlength="2" onChange="chkMonth();"\>

..men om jag skriver samma siffra iegn, då accepterar den det...tex: om jag skriver 1 istf 01 får jag först en varning...andra gången accepterar den det eftersom jag har "onChange"...vad kan man använda för annat för att den ska kolla varje gång...typ "LostFocus" eller nåt sånt?!

Permalänk: https://www.webforum.nu/p/1023665

## #3 — Peter S, 2003-04-24T11:31Z

```
<script type="text/javascript">
<!--

function validate(o){
	var n=o.name,v=o.value;
	switch(true){
		case n.indexOf("year")!=-1:
			var y=new Date().getYear();
			y=(y<1000)?y+1900:y;
			if(isNaN(v)||v.length!=4||parseInt(v)>y)
				alert("Felaktigt år");
		break;

		case n.indexOf("month")!=-1:
			if(isNaN(v)||parseInt(v)<1||parseInt(v)>12)
				alert("Felaktig månad");
		break;

		case n.indexOf("day")!=-1:
			if(isNaN(v)||parseInt(v)<1||parseInt(v)>31)
				alert("Felaktig dag");
		break;
	}
};

//-->
</script>

...

<INPUT TYPE="text" name=pub_year VALUE="" size="4" maxlength="4" onblur="validate(this)">
<INPUT TYPE="text" name=pub_month VALUE="" size="2" maxlength="2" onblur="validate(this)">
<INPUT TYPE="text" name=pub_day VALUE="" size="2" maxlength="2" onblur="validate(this)">
```

Det blir dock ganska irriterande med dessa varningsfönster  ;)   Dessutom är inte koden optimal eftersom användaren tillåts ange t.ex. 2003 \| 02 \| 31, vilket inte är ett korrekt datum.

 :)

Permalänk: https://www.webforum.nu/p/1023674

## #4 — ironhead, 2003-04-24T11:47Z

...men nu kan man ju skriva 1 på månad, men jag vill att det ska behövas 2 siffror....ex: 02 för Februari...

Permalänk: https://www.webforum.nu/p/1023681

## #5 — Peter S, 2003-04-24T11:55Z

Då lägger vi till en sak:

```
...
if(isNaN(v)||v.length!=2||parseInt(v)<1||parseInt(v)>12)
	alert("Felaktig månad");
...
```

 :)

Permalänk: https://www.webforum.nu/p/1023686

## #6 — ironhead, 2003-04-24T12:02Z

åh! tackar!

> Dessutom är inte koden optimal eftersom användaren tillåts ange t.ex. 2003 \| 02 \| 31, vilket inte är ett korrekt datum.

 
...om man skulle vilja lägga in en koll på att det bara går att köra tex. 28 dagar i Februari-månad.....blir det besvärligt då?

Permalänk: https://www.webforum.nu/p/1023692

## #7 — Peter S, 2003-04-24T12:08Z

Det beror på hur "noga" man vill vara. Tänk på att det var fjärde år är 29 dagar i februari  ;) 

 :)

Permalänk: https://www.webforum.nu/p/1023696

## #8 — ironhead, 2003-04-24T13:13Z

\*urk!\*  :(

Permalänk: https://www.webforum.nu/p/1023731

## #9 — Peter S, 2003-04-24T13:51Z

Om du nu bestämmer dig för att göra ett sådant skript kan du använda dig av följande funktion för att kontrollera huruvida ett år är skottår eller ej:

```
function isLeapYear(n){
     return (n%4==0)&&(n%100!=0)||(n%400==0);
};

alert(isLeapYear(1896)); // Ger [i]true[/i] eftersom år 1896 var ett skottår

alert(isLeapYear(2002)); // Ger [i]false[/i] eftersom år 2002 ej var ett skottår
```

 :)

Permalänk: https://www.webforum.nu/p/1023781

## #10 — ironhead, 2003-04-24T13:54Z

hittade detta här i forumet

			// hålla koll på skott-år
			if ((faltvardeAr % 4 == 0) \|\| (faltvardeAr % 100 == 0) \|\| (faltvardeAr % 400 == 0))
			{
				var skottar = 1;
			}
			
			// kollar så att man inte skriver in fel dag
			if (faltvardeDag \< 1)
			{
				err = "Månaden kan inte ha mindre än en dag";
			}
			// februari koll om det är skott-år
			if ((faltvardeManad == 2) && (skottar == 1) && (faltvardeDag \> 29))
			{
				err = "Det är skottår, d.v.s månaden har inte mer än 29 dagar";
			} 
			// februari koll om det INTE är skott-år
			if ((faltvardeManad == 2) && (skottar != 1) && (faltvardeDag \> 28))
			{
				err = "Det är inte skott år, d.v.s. månaden kan inte ha mer än 28 dagar";
			}
			// kollar de andra månaderna (31-dagars månaderna)
			if ((faltvardeDag \> 31) && ((faltvardeManad == "01") \|\| (faltvardeManad == "03") \|\| (faltvardeManad == "05") \|\| (faltvardeManad == "07") \|\| (faltvardeManad == "08") \|\| (faltvardeManad == "10") \|\| (faltvardeManad == "12")))
			{
				err = "Månaden har inte mer än 31 dagar";
			}
			// kollar de andra månaderna (30-dagars månaderna)
			if ((faltvardeDag \> 30) && ((faltvardeManad == "04") \|\| (faltvardeManad == "06") \|\| (faltvardeManad == "09") \|\| (faltvardeManad == "11")))
			{
				err = "Månaden har inte mer än 30 dagar";
			}
		}

.....hur ska man "konvertera" detta så att det passa Peters kod?

Permalänk: https://www.webforum.nu/p/1023785

## #11 — Peter S, 2003-04-24T15:12Z

Tills vidare:

```
function validate(o){
	var
		n=o.name,
		v=o.value,
		d=new Date(),
		ms=[31,(isLeapYear(d.getFullYear())?29:28),31,30,31,30,31,31,30,31,30,31];
	switch(true){
		case n.indexOf("year")!=-1:
			if(isNaN(v)||v.length!=4)
				alert("Felaktigt år");
		break;

		case n.indexOf("month")!=-1:
			if(isNaN(v)||v.length!=2||v<1||v>12)
				alert("Felaktig månad");
		break;

		case n.indexOf("day")!=-1:
			var te=document.forms["f"].elements["pub_month"].value;
			if(!isNaN(te))
				var m=ms[te-1];
			if(isNaN(v)||v<1||v>m)
				alert("Felaktig dag");
		break;
	}
	function isLeapYear(n){
		return (n%4==0)&&(n%100!=0)||(n%400==0);
	}
};

...

<form name="f">
	<INPUT TYPE="text" name=pub_year VALUE="" size="4" maxlength="4" onblur="validate(this)">
	<INPUT TYPE="text" name=pub_month VALUE="" size="2" maxlength="2" onblur="validate(this)">
	<INPUT TYPE="text" name=pub_day VALUE="" size="2" maxlength="2" onblur="validate(this)"> 
</form>
```

 :)

Permalänk: https://www.webforum.nu/p/1023873

## #12 — ironhead, 2003-04-28T08:48Z

Tack så mycket...verkar fungera!
Ska testa mera...

Permalänk: https://www.webforum.nu/p/1026657

## #13 — ironhead, 2003-04-28T09:11Z

...jag har lagt till ytterligare 3 input rutor i formuläret....hur gör man då?

\<form action="sida.asp" name="f" method="post"\>
\<INPUT TYPE="text" name=pub_year size="4" maxlength="4" onblur="validate(this)"\>  
\<INPUT TYPE="text" name=pub_month size="2" maxlength="2" onblur="validate(this)"\>  
\<INPUT TYPE="text" name=pub_day size="2" maxlength="2" onblur="validate(this)"\>  
\<INPUT TYPE="text" name=end_year size="4" maxlength="4" onblur="validate(this)"\> 
\<INPUT TYPE="text" name=end_month size="2" maxlength="2" onblur="validate(this)"\> 
\<INPUT TYPE="text" name=end_day size="2" maxlength="2" onblur="validate(this)"\> 
\<INPUT TYPE="submit" VALUE="Spara"\>
\</form\>

Permalänk: https://www.webforum.nu/p/1026671

## #14 — Peter S, 2003-04-28T11:54Z

Vad är det för kriterier som skall gälla för samtliga "input"-element?

Det första datumet får inte vara större än dagens datum och det andra datumet för inte vara mindre än dagens datum?

 :)

Permalänk: https://www.webforum.nu/p/1026758

## #15 — ironhead, 2003-04-28T13:56Z

inte nödvändigtvis...skulle bara vilja få det att fungera så att man:

\* måste skriva siffror
\* måste ha 4 siffror i årtal
\* måste ha 2 siffror för månad & dag
\* inte kan skriva in fler dagar än det är den månaden och att skottår skall inkluderas

...om det inte blir för struligt med publikationsdatum som inte får vara större än stoppdatum, så välkomnas det med öppna armar, för mina kunskaper om javascript har tagit slut för länge sedan  ;)

Permalänk: https://www.webforum.nu/p/1026846

## #16 — Peter S, 2003-04-28T15:27Z

Har inte hunnit testa det så mycket men någonting sådant här kanske ( fälten valideras då formuläret skickas istället ):

```
function validate(o){
	var
		elm=o.elements,
		l=elm.length-1,
		m=[31,0,31,30,31,30,31,31,30,31,30,31],
		d1=null,
		d2=null;

	for(var i=0; i < l; i++){
		var e=elm[i];

		if(e.name.indexOf("year")!=-1){
			if(isNaN(e.value)||e.value.length!=4){
				alert("Felaktigt årtal");
				e.focus();
				return false;
			}
		}
		if(e.name.indexOf("month")!=-1){
			if(isNaN(e.value)||e.value.length!=2||e.value<1||e.value>12){
				alert("Felaktig månad");
				e.focus();
				return false;
			}
		}
		if(e.name.indexOf("day")!=-1){
			m[1]=isLeapYear(o[i-2].value)?29:28;

			if(isNaN(e.value)||e.value.length!=2||e.value<1||e.value>m[o[i-1].value-1]){
				alert("Felaktig dag");
				e.focus();
				return false;
			}
		}
	}

	if(new Date(o.elements[0].value+"/"+o.elements[1].value+"/"+o.elements[2].value) > new Date(o.elements[3].value+"/"+o.elements[4].value+"/"+o.elements[5].value)){
		alert("Publikationsdatumet får ej vara större än stoppdatumet");
		return false;
	}

	function isLeapYear(n){
		return (n%4==0&&n%100!=0)||(n%400==0);
	}
};

...

<form action="sida.asp" name="f" method="post" onsubmit="return validate(this)">
<INPUT TYPE="text" name=pub_year size="4" maxlength="4">
<INPUT TYPE="text" name=pub_month size="2" maxlength="2">
<INPUT TYPE="text" name=pub_day size="2" maxlength="2">
<INPUT TYPE="text" name=end_year size="4" maxlength="4">
<INPUT TYPE="text" name=end_month size="2" maxlength="2">
<INPUT TYPE="text" name=end_day size="2" maxlength="2">
<INPUT TYPE="submit" VALUE="Spara">
</form>
```

 :)

Permalänk: https://www.webforum.nu/p/1026922

## #17 — ironhead, 2003-04-28T18:06Z

Får problem med denna rad:

l=elm.length-1,

felmess:
length is not an object

Permalänk: https://www.webforum.nu/p/1027088

## #18 — Peter S, 2003-04-28T18:23Z

Prova att ändra den raden till:

```
l=o.elements.length-1,
```

 :)

Permalänk: https://www.webforum.nu/p/1027112

## #19 — ironhead, 2003-04-29T06:17Z

eh! sorry, det va mitt fel...glömde ta bort javascriptet i input...  :r 

Nu när jag postar formuläret köper den att start-datum kan vara flera år mer än slutdatum...

Permalänk: https://www.webforum.nu/p/1027384

## #20 — Peter S, 2003-04-29T07:24Z

Det verkar konstigt. De första tre "input"-fälten är ju startdatumet och de sista tre fälten stoppdatumet. Skriver du då, t.ex. följande så bör skriptet säga ifrån:

"2002" "10" "31" - "1998" "10" "10"

Jag har dock gjort en liten ändring:

```
<script type="text/javascript">
<!--

function validate(o){
	var
		elm=o.elements,
		l=elm.length-1,
		m=[31,0,31,30,31,30,31,31,30,31,30,31],
		d1=null,
		d2=null;

	for(var i=0; i < l; i++){
		var e=elm[i];

		if(e.name.indexOf("year")!=-1){
			if(isNaN(e.value)||e.value.length!=4){
				alert("Felaktigt årtal");
				e.focus();
				return false;
			}
		}
		if(e.name.indexOf("month")!=-1){
			if(isNaN(e.value)||e.value.length!=2||e.value<1||e.value>12){
				alert("Felaktig månad");
				e.focus();
				return false;
			}
		}
		if(e.name.indexOf("day")!=-1){
			m[1]=isLeapYear(o[i-2].value)?29:28;

			if(isNaN(e.value)||e.value.length!=2||e.value<1||e.value>m[o[i-1].value-1]){
				alert("Felaktig dag");
				e.focus();
				return false;
			}
		}
	}

	if(new Date(o.elements[0].value+"/"+o.elements[1].value+"/"+o.elements[2].value).valueOf() > new Date(o.elements[3].value+"/"+o.elements[4].value+"/"+o.elements[5].value).valueOf()){
		alert("Publikationsdatumet får ej vara större än stoppdatumet");
		return false;
	}

	function isLeapYear(n){
		return (n%4==0&&n%100!=0)||(n%400==0);
	}
};

//-->
</script>
```

 :)

Permalänk: https://www.webforum.nu/p/1027410

---

Tråden på webben: https://www.webforum.nu/amne/javascript/74854-onchange-validate  
Nästa sida: https://www.webforum.nu/amne/javascript/74854-onchange-validate/page2.md