Valideringsfunktioner

det er jo et vidt begreb :) men her er lidt info som burde kunne lede dig på ved;

funktionen jeg laver kaldes sådan;

onSubmit="return Checkform(this);"

og funktionen ser sådan ud;

<script language="JavaScript">

function Checkform(thisform)
{
    strError = 'Der opstod følgende fejl:\n\n';
        intError = 0;

    if (intError == 1) {
    alert(strError)
        return false;
        }
'dine tjeck
}

</script>

og lidt eksempler på diverse tjecks...

ikke tom

    if (thisform.FORMNAVN.value == ""){
    intError = 1;
    strError = strError + '- xxx skal udfyldes\n'
    thisform.FORMNAVN.focus();
    }

hvis ikke tom, så skal den indeholde noget;

    if (thisform.FROMNAVN.value.indexOf("http://") == -1 && thisform.link.value != ""){
    intError = 1;
    strError = strError + '- xxx skal starte med \'http://\'\n'
    thisform.FORMNAVN.focus();
    }

hvis ikke tom, så må den ikke indeholde;

    if (thisform.FORMNAVN.value.indexOf("'") != -1 && thisform.billede.value != ""){
    intError = 1;
    strError = strError + '- xxx må ikke indeholde \'\n'
    thisform.FORMNAVN.focus();
    }

skal være tal;

if (isNaN(thisform.FORMNAVN.value)){
    intError = 1;
    strError = strError + '- xxx skal være tal\n'
    thisform.FORMNAVN.focus();
    }

håber det meste er med her eller i det mindste kan udarbejdes herfra - ellers må du jo sige til

Mindst fem karakterer:

if (thisform.FELTNAVN.value.length < 5) {
intError = 1;
strError += "- xxx skal være mindst fem karakterer langt\n";
thisform.FELTNAVN.focus();
}

E-mail validering:
http://javascript.internet.com/forms/email-address-validation.html

Skal være tal:

reg = /^\d{8}$/;
reg2 = /^\d{2} \d{2} \d{2} \d{2}$/;
reg3 = /^\d{4} \d{4}$/;
if (!(thisform.FELTNAVN.value.match(reg) || thisform.FELTNAVN.value.match(reg2) || thisform.FELTNAVN.value.match(reg3)) {
intError = 1;
strError += "- xxx skal være et telefonnummer!\n";
thisform.FELTNAVN.focus();
}

Check for radio-buttons:

f = false;
for (i = 0; i < thisform.RADIONAVN.length; i++)
if (thisform.RADIONAVN[i].checked) {
f = true;
break;
}
if (!f) {
intError = 1;
strError += "- xxx skal være valgt!\n";
thisform.RADIONAVN[0].focus();
}

Checkbutton skal være valgt:

if (!thisform.CHECKNAVN.checked) {
intError = 1;
strError += "- xxx skal være valgt!\n";
thisform.CHECKNAVN.focus();
}

Telefonnummer tjekket skal se således ud:

reg = /^\d{8}$/;
reg2 = /^\d{2} \d{2} \d{2} \d{2}$/;
reg3 = /^\d{4} \d{4}$/;
if (!(thisform.FELTNAVN.value.match(reg) || thisform.FELTNAVN.value.match(reg2) || thisform.FELTNAVN.value.match(reg3))) {
intError = 1;
strError += "- xxx skal være et telefonnummer!\n";
thisform.FELTNAVN.focus();
}

I tager begge to udgangspunkt i at jeg kender feltnavnene. Og at der kun er et felt der f.eks. tjekkes for 5 karakterer. Men problemet er at felterne genereres dynamisk (asp) og derfor vil jeg gerne kalde funktionen med feltets navn i onsubmit eventen.

Derfor har jeg f.eks. lavet et tjek for 8 karakterer således:

    function val8(str) {
        if (str.length < 8) {
            alert("Du skal minimum skrive 8 karakterer");
            return false;
        }
    }
Så har jeg kaldt funktionen med return val8(document.formnavn.feltnavn.value);

Men jeg tror dog godt at jeg kan omskrive jeres forslag. Jeg tester lige...

Der er ikke særlig meget, der skal omskrives, men hvis du får problemer, kan du jo bare spørge.

Jeg har problemer med radiobuttons.

hvordan det

Jeg kan ikke omskrive det så det passer ind i mit kram.

Du kan evt. gøre dette:

function valRadio(rad) {
f = false;
for (i = 0; i < rad.length; i++)
if (rad[i].checked) {
f = true;
break;
}
if (!f) {
alert("Du skal vælge en radio-button!");
return false;
}
return true;
}

Det kaldes med:

onSubmit="return valRadio(this.radioNavn);"

Forøvrigt er det ulovligt ifølge HTML-standarden ikke at angive en radio-button som default checked.

Ja det er muligt. Men i et survey system skal man jo helst ikke lede svarene på vej ;-) Jeg prøver lige.

Der sker det samme som med mit forsøg. Fejl: "Objektet understøtter ikke denne egenskab eller metode." Fejl i linien: "f = false;"

Smid et link. Der kan umuligt være noget galt i den linje. Prøv evt. dette:

function valRadio(rad) {
f = false;
for (i = 0; i < rad.length; i++) {
if (rad[i].checked) {
f = true;
break;
}
}
if (!f) {
alert("Du skal vælge en radio-button!");
return false;
}
return true;
}

Samme resultat.

Prøv selv.

<html>
<head>
<title>Untitled</title>
<script>
function valRadio(rad) {
f = false;
for (i = 0; i < rad.length; i++) {
if (rad[i].checked) {
f = true;
break;
}
}
if (!f) {
alert("Du skal vælge en radio-button!");
return false;
}
return true;
}
</script>
</head>
<body>
<form method="post" name="f" action="mf.asp?mode=test" onsubmit="return valRadio(document.f.cpr);">
<input type="radio" name="cpr" value="1">
<input type="radio" name="cpr" value="2">
<input type="radio" name="cpr" value="3">
<input type="submit" ACCESSKEY="u" TITLE="[alt+u]" value="ok">
</form>
</body>
</html>

Det er fordi, du kalder formen det samme som min variabel (skam dig, jeg kom først)! :)

Skift denne linje:

<form method="post" name="f" action="mf.asp?mode=test" onsubmit="return valRadio(document.f.cpr);">

... ud med dette:

<form method="post" action="mf.asp?mode=test" onsubmit="return valRadio(this.cpr);">

Det er meget nemmere bare at skrive "this" i stedet for "document.blabla", og det er også programmeringsmæssigt "smukkere".

Der kan man bare se...

Hvad med den her:

"Desuden ønsker jeg en funktion der kan validere at man f.eks. vælger "Mand" i en radiobutton option og senere vælger at man bruger p-piller."

Hvorfor virker en valideringsfkt. ikke på to formfelter samtidig?

Eks.

<HTML>
<HEAD>
<link rel="stylesheet" type="text/css" href="includes/style.css">
<script>
function val6(str6,spm6) {
        if(!str6.match(/^[\w]{1}[\w\.\-_]*@[\w]{1}[\w\-_\.]*\.[\w]{2,6}$/i)) {
            alert("Der er fejl i email adressen"+spm6);
            return false;
        }
    }
</script>
</HEAD>
<BODY bgcolor="#B7C888">
<form method="post" action="survey.asp?mode=vote_process" name="EZForm" Onsubmit="return val6(document.EZForm.Te42.value,' i spørgsmålet: #Email2#');return val6(document.EZForm.Te41.value,' i spørgsmålet: #Email#');">
<span class="overskrift">Validering</span><br><br>
Tester<br>
<table class="text">
<tr><td><img src="images/spm2.gif" align="left"> Email</td></tr><tr><td colspan=3><table class="text"><tr><td><input type="text" name="Te41"></tr></table><br></td></tr></tr><tr><td><img src="images/spm2.gif" align="left"> Email2</td></tr><tr><td colspan=3><table class="text"><tr><td><input type="text" name="Te42"></tr></table><br></td></tr></tr>
</table>
<input type="submit" Value="Stem">
</form>
</BODY>
</HTML>

Jeg kan stadig ikke få validering til mere end et felt til at virke har prøvet med denne uden held:

function validateForm(thisform) {

    strError = 'Der opstod følgende fejl:\n\n';
    intError = 0;

        if (thisform.Te41.length < 2) {
            intError = 1;
            strError = strError + '- xxx skal udfyldes\n'
        }
    else   
        if (thisform.Te42.length < 2) {
            intError = 1;
            strError = strError + '- xxx skal udfyldes\n'
        }

    if (intError > 0) {
    alert(strError)
    return false;
    }
    else {
          return true          // OK, formen må submittes
      }
}

Jeg forstår ikke, hvad du mener i tilfældet med manden og p-pillerne!

Hvis du bare vil validere på to felter som ovenstående, så er det meget nemmere at gøre således (keysersoze's forslag virker kun, hvis du vil alerte ALLE fejl på én gang):

function valider(frm) {
if (frm.Te41.length < 2) {
alert("Te41 skal være mere end 1 karaktér lang!");
return false;
}
if (frm.Te42.length < 2) {
alert("Te42 skal være mere end 1 karaktér lang!");
return false;
}
return true;
}

Det virker ikke for mig.

Det skal det gøre. Så er der noget galt et andet sted på siden.

Husk at scriptet skal kaldes således:

<form onSubmit="return valider(this);">

Har du selv prøvet at teste det?

<HTML>
<HEAD>
<script>
function valider(frm) {
if (frm.Te41.length < 2) {
alert("Te41 skal være mere end 1 karaktér lang!");
return false;
}
if (frm.Te42.length < 2) {
alert("Te42 skal være mere end 1 karaktér lang!");
return false;
}
return true;
}
</script>
</HEAD>
<BODY bgcolor="#B7C888">
<form method="post" action="mf.asp?mode=test" name="mf" Onsubmit="return valider(this)">
<input type="text" name="Te41">
<input type="text" name="Te42">
<input type="submit" Value="Stem">
</form>
</BODY>
</HTML>

Der mangler selvfølgelig at stå value:

function valider(frm) {
if (frm.Te41.value.length < 2) {
alert("Te41 skal være mere end 1 karaktér lang!");
return false;
}
if (frm.Te42.value.length < 2) {
alert("Te42 skal være mere end 1 karaktér lang!");
return false;
}
return true;
}

P.S. "Onsubmit" skal enten staves "onSubmit" eller "onsubmit". Alt andet er imod standarderne!

Det er der da vist ikke noget krav om. Men det er programmeringsmæssigt smukkere at se på.

Smid lige et link hvis jeg tager fejl :)

HTML tillader selvfølgelig alskens fejl, men i javascript skal eventhandlere skrives korrekt. Og det er altså korrekt, som jeg siger! :)

Jeg kan ikke rigtigt finde noget reference, men her:
http://developer.netscape.com/docs/manuals/communicator/jsguide4/evnt.htm
... står der da, at JavaScript er case-sensitivt, og at man skal enten skrive med små bogstaver eller bruge "mixed case".

Jeg får spadsmer snart!!!!!

Hvorfor submitter formen selvom der alertes ved en fejl her?

function valider() {
if (document.EZForm.Te44.value.length < 1) {
            alert("Du har glemt at udfylde feltet"+'Textinput');
            return false;
}

if(!document.EZForm.Te45.value.match(/^[\w]{1}[\w\.\-_]*@[\w]{1}[\w\-_\.]*\.[\w]{2,6}$/i)) {
            alert("Der er fejl i email adressen"+'Email');
            return false;
}

f = false;
for (i = 0; i < document.EZForm.Ra46.length; i++) {
if (document.EZForm.Ra46[i].checked) {
f = true;
break;
}
}
if (!f) {
alert("Du skal vælge en svarmulighed"+'Radios');
return false;
}

return true;
}

Nevermind jeg fandt ud af den.

Nu mangler jeg bare:

"Desuden ønsker jeg en funktion der kan validere at man f.eks. vælger "Mand" i en radiobutton option og senere derfor ikke kan vælge at han bruger p-piller i en anden radiobutton."

Som sagt forstår jeg ikke, hvad du mener med den sætning.

Men prøv lige at tjekke det her link:
http://www.peterbailey.net/fValidate/
Det kan du formentlig bruge!

Lad os sige jeg har 3 spørgsmål i en form.

Spørgsmål 1: Hvad er dit køn? _ Mand  _Kvinde

Spørgsmål 2: Hvor gammel er du? ______

Spørgsmål 3: Bruger du P-piller? _Ja  _Nej

Så vil jeg gerne kunne forhindre at man kan svare Ja i spørgsmål 3 hvis man samtidig har svaret "mand" i spørgsmål 1. Giver det mening nu?

Kan du som det sidste ikke også lige vise hvordan man indsætter denne funktion i "vores" valider() funktion. Altså så det omskrives det if sætninger inden i valider() i stedet for 3-4 funktioner.

function isLeapYear(year)
{
    var result = false;
    var div4,div100,div400;

    div4 = year % 4;
    div100 = year % 100;
    div400 = year % 400;

    result = ((div4==0) & (div100!=0)) || ((div100==0) && (div400==0))
    return result;
}

function validateDate(d)
{
    if(d.length!=6)
        return false;

    var daysInMonth = Array(0,31,28,31,30,31,30,31,31,30,31,30,31);
    var day = parseInt(d.substr(0,2),10);
    var month = parseInt(d.substr(2,2),10);
    var year = parseInt(d.substr(4,2),10);

    if(year < 0)
        return false;

    if(isLeapYear(year))
        daysInMOnth[2] = 29;

    if(month < 1 || month > 12)
        return false;

    if(day < 1 || day > daysInMonth[month])
        return false;

    return true;
}

function validateCPR(cpr)
{
    // requires: cpr no - format: DDMMYYCCCC
    // CCCC: control digits

    if(cpr.length!=10)
        return false;

    var d = cpr.substr(0,6);
   
    if(!validateDate(d))
        return false;

    var w = 4*parseInt(cpr.substr(0,1),10) +3*parseInt(cpr.substr(1,1),10) +2*parseInt(cpr.substr(2,1),10) +7*parseInt(cpr.substr(3,1),10)
            +6*parseInt(cpr.substr(4,1),10) +5*parseInt(cpr.substr(5,1),10) +4*parseInt(cpr.substr(6,1),10) +3*parseInt(cpr.substr(7,1),10)
            +2*parseInt(cpr.substr(8,1),10) +parseInt(cpr.substr(9,1),10);

    if(w%11!=0)
        return false;

    return true;
}

function val1(str1,spm1)
{
    if (!validateCPR(str1)) {
      window.event.returnValue = false;
      window.event.cancelBubble = true;
      alert("CPR-Nummer ikke validt"+spm1);
    }   
}

Mht. til den med p-piller, så kan du gøre således:

for (i = 0; i < document.EZForm.koen.length; i++)
if (document.EZForm.koen[i].checked) {
val1 = document.EZForm.koen[i].value;
break;
}
for (i = 0; i < document.EZForm.ppiller.length; i++)
if (document.EZForm.ppiller[i].checked) {
val2 = document.EZForm.ppiller[i].value;
break;
}
if (val1 == "Mand" && val2 == "Ja") {
alert("Bla!");
//Formen skal IKKE submittes!
}

Hvad er der galt i at have valideringen i forskellige funktioner?