Avatar billede 2is Nybegynder
18. juli 2003 - 21:42 Der er 33 kommentarer

validering af form

Hej
dette er mit første spørgsmål i eksperten, jeg har spurgt andre steder, men man kan jo ikke tvinge et svar frem, men prøve et nyt sted .
For at få datoformatet rigtigt i en hjemmeside der indeholder en medlemsdatabase, har jeg valge at lave 3 select (dato måned år) og så sætte dem sammen , men nu vil jeg tjekke om der enten ingen er valgt eller alle er valgt, hvis ikke skal der komme en fejl og focus på manglende select, men et kniber med opbygningen og få den til at virke, i mine mange forsøg har jeg lavet 2 ens efter hinanden (blandt andre) men hvorfor stopper den ikke ved den første når den gør ved den anden, bytter jeg om på dem, er det ALTID den nederste der stopoper.
hvorfor det ????

    if((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='') &&  (error==0))
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato2');
            error = 1;
            document.forms[0].error.focus();
            }


           
    if((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='') &&  (error==0))
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato1');
            error = 0;
            document.forms[0].error.focus();
            }

Venlig hilsen Erik Isager
(håber jeg også kan finde svaret når det kommer)
Avatar billede 2is Nybegynder
18. juli 2003 - 21:44 #1
Ja nu er det sevlfølgelig en fejl på den jeg sendte (jeg har forsøgt så meget) men der står error = 1; i begge
Erik Isager
Avatar billede hoejrup Nybegynder
18. juli 2003 - 22:03 #2
if ((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='') &&  (error==0))
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato1');
            error = 0;
            document.forms[0].error.focus();
            } else if ((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='') &&  (error==0))
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato2');
            error = 1;
            document.forms[0].error.focus();
            }
}

/per
Avatar billede hoejrup Nybegynder
18. juli 2003 - 22:04 #3
if ((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='') &&  (error==0))
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato1');
            error = 1;
            document.forms[0].error.focus();
            } else if ((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='') &&  (error==0))
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato2');
            error = 1;
            document.forms[0].error.focus();
            }
}
/per
Avatar billede 2is Nybegynder
18. juli 2003 - 23:40 #4
Jo tak
nu ville jeg jo hellere ha haft en forklaring på hvorfor den ikke stoppede ved den første, ovenstående er jo et eksempel jeg er kommet til i mine mange forsøg på at få det til at virke, (der er jo ingen grund til at tjekke for det samme 2 gange)
hvad kan jeg gøre for at få den til at stoppe ved først fundne fejl og så ikke gå længere før fejlen er rettet ??
Skal jeg be den om at starte tjek() forfra ? hvis ja, så hvordan

i den form hvor indholdet valideres, skal der tjekkes 4 dato sæt (ialt 4 x 3 select)de må gerne være tomme , men hvis en er valgt skal det datosæt gøres færdigt.

Venlig hilsen Erik Isager
Avatar billede hoejrup Nybegynder
18. juli 2003 - 23:42 #5
if ((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='') &&  (error==0))
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato1');
            error = 1;
            document.forms[0].error.focus();
            return false;
            } else if ((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='') &&  (error==0))
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato2');
            error = 1;
            document.forms[0].error.focus();
            return false;
            }
}

/per
Avatar billede hoejrup Nybegynder
18. juli 2003 - 23:44 #6
if ((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='')
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato1');
            document.forms[0].error.focus();
            return false;
            } else if ((document.forms[0].hfd.value!='') || (document.forms[0].hfm.value!='') || (document.forms[0].hfy.value!='')
            {
            document.forms[0].error.value = "der er mindst valgt en dato"
            alert('der er mindst valgt en dato2');
            document.forms[0].error.focus();
            return false;
            }
}

/per
Avatar billede 2is Nybegynder
19. juli 2003 - 01:12 #7
Jeg har forsøgt lidt mere, uden at blive ret meget klogere,
jeg har lavet en side der indeholder de ønskede select, og validering og det virker som jeg gerne vil have.
når jeg så kopiere hele valideringen over i den det skal være i (i en tabel), så virker det ikke helt som på den side jeg kopierede fra,
Skulle nogen have lyst at kaste et blik på siderne er de nu lagt ud på:
http://hjem.get2net.dk/isager/erik/validering/fejltjek.html
og på:
http://hjem.get2net.dk/isager/erik/validering/opret.html
(opret er den der ikke virker som den skal)
På forhånd tak !

Venlig hilsen Erik Isager
Avatar billede roenving Novice
19. juli 2003 - 01:24 #8
For det første skal du forhindre afsendelse hvis der ikke er et tilfredsstillende resultat, så du skal:

<form ... onsubmit="return tjek()">

-- og så i din tjek()-funktion:

return false; hvis det ikke er i orden

og return true, hvis det er OK ...

Men du kan jo også vælge at gøre sådan (lige nu hentet på http://www.staal-larsen.dk/mail/contact_test2.htm -- havde den mærkværdigvis ikke liggende selv !-)

//Script til inputmaske for datofeltet. START
var newVal="";
var fdate = null;
var dd=0;
var mm=0;
var repeatRemove=0;

function getCharCode(e){
return (e.which)?e.which:e.keyCode;
}

function restoreVal(eC,fld){
    if (eC==8||repeatRemove>0){
        if (newVal.length>repeatRemove){
              newVal=newVal.substring(0,newVal.length-repeatRemove)
        }else{
            newVal="";
        }
    }
    repeatRemove=0;
    fld.value=newVal;
}

function inputDate(e,fld){
removeChar=false;
newVal=fld.value;
charCode = getCharCode(e);
if ((fld.value.length==2 || fld.value.length==5) && charCode==47){newVal+="/";return true;}
if (fld.value.length==10 || charCode>57 || charCode<48){
    return false;
    }
   
newVal=fld.value+String.fromCharCode(charCode)

switch (fld.value.length){
    case 0:
          if (+newVal>3){repeatRemove++;return false;}
          break;
      case 1:
          if (+newVal>31){repeatRemove++;return false;}
          if (+newVal==00){repeatRemove++;return false;}
          dd = +newVal;
          newVal+="/";
          break;
      case 2:
          newVal=fld.value+"/"+String.fromCharCode(charCode)
          if (charCode>49){repeatRemove++;return false;}
          break;
      case 3:
          if (charCode>49){repeatRemove++;return false;}
          break;
      case 4:
        mm = parseInt(newVal.substring(3),10);
        if (mm==2 && dd>29 || mm>12 || mm==00){repeatRemove++;return false;}
        if (dd==31 && (mm==4 || mm==6 || mm==9 || mm==11)){repeatRemove++;return false;}
        newVal+="/";
        break;
    case 5:
          newVal=fld.value+"/"+String.fromCharCode(charCode)
          break;
      case 6:
          if (charCode<50 || charCode>50){repeatRemove++;return false;} //Tillader 2 som første tal i årstal
          break;
      case 7:
          var yy = parseInt(newVal.substring(6));
          if (yy<20 || yy>20){repeatRemove++;return false;} //Tillader 20 som første to tal i årstal
          break;
      case 8:
          var yyy = parseInt(newVal.substring(6));
          if (yyy>200){repeatRemove++;return false;} //Tillader kun 0 som trejde tal, hvis første to er 2 og 0.
          break;
      case 9:
          var yyyy = parseInt(newVal.substring(6));
          if (mm == 2 && dd == 29 && yyyy%4 !=0){repeatRemove+=8;return false;}
      case 9:
          var yyyy = parseInt(newVal.substring(6));
          if (mm == 2 && dd == 29 && yyyy%4 !=0){repeatRemove+=8;return false;}
          if(fld.name=='firstinput'){
          fdate = new Date(newVal.substring(6),parseInt(newVal.substring(3,5),10)-1,parseInt(newVal.substring(0,2),10));
          }else{
          sdate = new Date(newVal.substring(6),parseInt(newVal.substring(3,5),10)-1,parseInt(newVal.substring(0,2),10));
          var forsk = Math.round((sdate-fdate)/(24*60*60*1000));
          fld.form.forskel.value = forsk + 1;
}
}
return true;
}
//Script til inputmaske for datofelt. SLUT

Den skal så aktiveres med et input-felt, som ser sådan ud:
<INPUT class=FormInput onkeypress="return inputDate(event,this);" onkeydown=if(getCharCode(event)==8)repeatRemove++; onblur="if(this.value=='')this.value=this.defaultValue;" onkeyup=restoreVal(getCharCode(event),this);this.focus(); onfocus="if(this.value==this.defaultValue)this.value='';" tabIndex=11 maxLength=10 size=25 value=dd/mm/åååå name=secondinput>

-- lavet i et par omgange som svar på forskellige spørgsmål her på E*, men helt suveræn i sin funktion
Avatar billede 2is Nybegynder
19. juli 2003 - 12:49 #9
hej
Der er jo meget overflødigt i ovenstående (men jeg kigger den lidt mere efter, jeg kunne måske få gode ideer fra den), alle dato "input" kommer jo fra select, så de er rigtigt, det er et spørgsmål om der er noget eller ikke i de rigtige kombinationer.

hvad er forskellen på :
return false;
og
error = 1;

hilsen erik
Avatar billede hoejrup Nybegynder
19. juli 2003 - 13:05 #10
Hvis du anvender error = 1; , så skal den nulstilles igen. Ellers bliver din kontrol rutine kun afviklet en gang.

/per
Avatar billede roenving Novice
19. juli 2003 - 15:18 #11
>>2is

Du er selvfølgelig velkommen til at tage noget af min funktion, men grundlæggende skal du vælge at gå tilbage til at folk selv skriver (hvilket jeg selv foretrækker -- selects med 31 valgmuligheder har det med at forsvinde ud af skærmen ,-) og så bruge den jeg viste, eller også bruge metoden med selects, og så kan du ikke bruge en eneste linje af den kode jeg dumpede ...
-- hvis du forøvrigt kan finde andet end den kode som finder forskel på to datoer til sidst som er overflødig vil jeg meget gerne have det at vide ...

-- og dit udsagn om at folk kun kan levere rigtige data med selects er i bedste fald en overseelse, for dine selects fjerner ikke muligheden for at angive d. 31/2-2011 ...

-- men en af grundene til at jeg viste den frem er, at den måde at hente værdier i selects som I bruger, i heldigste fald virker i browsere fremstillet i Seattle men da den ikke er anerkendt som ordentlig javascript-metode er det nemt at få problemer andre steder ...

selectBox.options[selectBox.selectedIndex].value hedder den rigtigt og så får man altså nemt nogle uoverskuelige statements
Avatar billede 2is Nybegynder
19. juli 2003 - 19:45 #12
Jeg er næsten ny i dette, så derfor er det rart at se hvad men kan gøre.
Oven stående har givet mig lidt nye ideer, men jeg kan ikke bruge som sådan !
(select 31) den viser kun 10 af gangen og det er kun sjældent at andet end d.1 skal bruges, måske fjerner jeg helt datoen ?? det kommer an på dem der skal bruge det jeg laver.

Men jeg prøver videre og komme nok tilbage (snart)
Hilsen Erik
Avatar billede 2is Nybegynder
20. juli 2003 - 20:16 #13
Så er jeg her igen !
--
//klip
Hvis du anvender error = 1; , så skal den nulstilles igen. Ellers bliver din kontrol rutine kun afviklet en gang.
--
Hvis der kommer en fejl køren valideringen "til bunden" men den begynder vel forfra næste gang

Hvis jeg istedet anvender
Return true / false  så skal jeg vel stadig tjekke return status for ikke at komme igennem andre tjek som vel så kan ændre false til true ??

Men jeg tror jag har fået brygget noget sammen jeg kan bruge, det er langt, men det virker (skudår er der dog ikke taget højde for)
nu er jeg godt klar over dette ikke er et kontrold sted, men hvis nogen gider kaste et blik på mit arbejde, og så sige hvad jeg bør gøre anderledes
kan ses på:
http://hjem.get2net.dk/isager/erik/validering/fejltjek.html
Venlig hilsen Erik Isager
PS  da det er mit første indlæg, point ! hvordan tildeler jeg dem ??
Avatar billede roenving Novice
20. juli 2003 - 20:27 #14
Return gør præcis hvad den siger -- den _afbryder_ funktionen og returnerer til kaldet ...

Og returnerer med det som står bagefter return -- med false vil den overlade en false til submit, som derfor ikke vil blive udført !-)
Avatar billede roenving Novice
20. juli 2003 - 20:43 #15
Hov en alvorlig fejl:
onsubmit="Tjek();return false;"

-- den vil aldrig blive submittet ...

Brug den som hoejrup har angivet og skriv:

onsubmit="return Tjek(this);"

og brug så det overførte form-objekt i din kode:

function Tjek(f)
    {

//tjekker navn
    if(f.navn.value=='')
          {
        alert('Du skal skrive dit for- og efternavn!');
        f.navn.focus();
        return false; //her vil funktionen blive fuldstændig afbrudt !-)
        }

Prøv lige at kigge på http://roenving.users.whitehat.dk/WD3Input.html for at se på lidt smarte inputs ...

Jeg er ikke endnu nået til en smart input-checker, men hvis jeg havde sådan en form som du har, ville jeg nærmere gøre noget i denne stil:

function Tjek(f){
  //checker først alle inputs
  for(i=0;f.elements.length>i;i++){
    if(f.elements[i].type.toLowerCase=='input'){
      if(f.elements[i].value=='' || f.elements[i].value==f.elements[i].defaultValue){
        alert('Du SKAL udfylde feltet '+f.elements[i].name);
        f.elements[i].focus();
        return false;
      }
    }
  }
  //Herefter check af andre elementer
}

-- et par linjer kortere ...

-----------------------------
Points kan du jo først uddele, når der er nogen som har lagt et svar, og da hverken hoejrup eller jeg har været sikre på, at du har fået løst dit problem har vi ikke lagt vores ideer som svar !-)
Avatar billede roenving Novice
20. juli 2003 - 20:58 #16
Hov, der var jo en fejl:

    if(f.elements[i].type=='text' && f.elements[i].tagName=='INPUT'){
Avatar billede 2is Nybegynder
20. juli 2003 - 21:56 #17
Hvorfor function Tjek(f)

Jeg har kigget lidt på linket (nylavet side?) men jeg forstår ikke ret meget af hvad der sker, og jeg vil meget gerne forstå hvad der sker ud fra det jeg skriver.
--
//klip
if(f.elements[i].type.toLowerCase=='input'
--
hvad betydedet der står mellem [] ??

//erik
Avatar billede roenving Novice
20. juli 2003 - 22:06 #18
Det er en tæller ...

En form har en property som indeholder en liste over alle elementer, som findes på formen (elements ,-) så ideen i det er at vi een for een checker alle elementer på formen (altså det første element, det andet element osv.) for om det er en input med type=text, som jo alle skal indeholde en tekst ...

-- men vær opmærksom på min rettelse, for den første var noget vrøvl !-)
Avatar billede hoejrup Nybegynder
20. juli 2003 - 22:13 #19
Det betyder at han undersøger alle indtastet karakterer i strengen, og om de overholder en fastsat værdi/indhold.
Hvis den ikke gør det, så skal cursoren stå ud for den forkerte karakter. Desuden fortæller javascriptet hvad der
skal stå i stedet for karakteren.

/per
Avatar billede roenving Novice
20. juli 2003 - 22:16 #20
>>hoejrup
Nej i den der henvises til er det elementets index (altså nummer !-)
Avatar billede hoejrup Nybegynder
20. juli 2003 - 22:22 #21
>> roenving

Dvs. at f.elements.length beskriver antallet af elementer i formen.

/per
Avatar billede roenving Novice
20. juli 2003 - 22:24 #22
Præcis !-)
Avatar billede roenving Novice
20. juli 2003 - 22:27 #23
-- lidt forvirrende kan jeg jo godt medgive dig, for det er jo samme property vi skal finde antallet af karakterer i i et string-objekt, men antallet af elementer i et array aflæses med .length på array-elementet ...

En rasende smart udnyttelse:

var a = new Array();

a[a.length] = noget;
a[a.length] = noget;
a[a.length] = noget;
a[a.length] = noget;
a[a.length] = noget;
a[a.length] = noget;

-- de vil blive nummereret fra 0 til 5 !-)
Avatar billede 2is Nybegynder
20. juli 2003 - 23:45 #24
Hej igen
jeg mente det bogstaveligt med mellem []
i mit står feks.
if(document.forms[0].navn.value=='')
hvad betyder det "0" der er imellem []
jeg har lavet lidt om på min validering, jeg kunne godt tænke mig at vide om det går den rigtige vej (jeg synes den virker)
den nye ligger på:
http://hjem.get2net.dk/isager/erik/validering/fejltjek.html
/erik
Avatar billede roenving Novice
21. juli 2003 - 00:06 #25
nullet betyder, at det er det første element i et array af forms ...

-- i javascript er det første tal 0 (nul !-) når man regner sig fremad gennem noget, så document.forms[0] betyder den første form på documentet og ofte også den eneste, men da man kan have et ubegrænset antal -- nja vel ikke over ca. 4 * 2^40 -- findes det som en liste over forms -- derfor tælleren ...

-- du har ikke ændret den der return Tjek() <-- den SKAL laves om

-- og du har overset nogle steder, hvor der mangler return false;


Og DU MÅ IKKE SENDE PÅ DEN MÅDE, når du alligevel har en form, som kan submitte:

    alert('der er ingen fejl, der sendes')
//SLET DETTE HER:    document.forms[0].submit();

-- se det i sammen hæng med min kommentar ovenfor -- return Tjek() ...

-- og så vil du spare en del af browserens kræfter og dine med at gennemlæse og fejlchecke hvis du bruger: return Tjek(this) !o]
Avatar billede 2is Nybegynder
21. juli 2003 - 01:02 #26
[] det kan vi så bare kalde nummerering ,

jeg har ikke overset return false (hvis du klikker på regler, så vil du kunne se at der ikke SKAL være datoer, men hvis en gruppe er påbegyndt, så skal den også færdiggøres,)

det skal jo laves til en asp fil der så gemmer data i en datadase ved at køre den kode igennem (som selt ikke er på endnu) , så den skal jo køre en anden kode igennem for så når den komme til enden :Response.Redirect medlemslisten.asp . Ændre det noget på det du skrev ??
/erik
Avatar billede roenving Novice
21. juli 2003 - 01:18 #27
-- grunden til at jeg skrev overset var, at jeg fik et par fejlmeddelelser og så sendte den alligevel !-)

Nej, asp-delen betyder vel grundlæggende ikke noget for valideringen ...

Men ideen er vel den, at slipper noget igennem valideringen, så skal formen submittes ...

med et form-tag sådan:

<form ... onsubmit="return Tjek(this);">

vil det være præcis hvad du opnår ved at sætte return false; alle de steder hvor den ikke validerer korrekt, og så sætte return true; til sidst -- der er ligesom ikke nogen grund til at forhindre den naturlige opførsel for i stedet at gennemtvinge den med andre metoder !o]

-- noget andet er, at det at bruge form.submit() er en dårlig vane, da den forhindrer kørsel af onsubmit -- præcis hvad du har brug for her, men ikke altid det ønskelige ...

-- i din valideringsdel skal du selvfølgelig afspejle den modul-opbygning som er i din form, så måske vil du alligevel have brug for en mellemvariabel inde i dine modul-checks, så meget har jeg ikke sat mig ind i den helt præcise opbygning af din form ...
Avatar billede 2is Nybegynder
21. juli 2003 - 16:30 #28
Hej, nu har jeg sovet lidt, og begynder på en frisk, jeg har lavet en ny lille sag er det til at overskue, men den bliver sendt med og uden fejl.  hvordan skal den rettes, det er helt lige meget hvad der står, der skal bare være noget i feltet.
-
<%Option Explicit%>

<%
'altid den nyeste
  Response.AddHeader "Pragma", "no-cache"
  Response.AddHeader "Cache-control", "private"
  Response.Expires = -1000
%>

<%
    ' er der noget i submit ??
If Request.QueryString("submit") <> "" Then
    ' skriv ..
Response.write "Alt er tjekket og er sendt nu ! "

end if


%>

<html>
<head>
<title>tjek form</title>

<script type="text/javascript" language="JavaScript">

<!-- start

function tjek()
    {
    if(document.forms[0].felt1.value=='')
        {
        alert('felt1 er IKKE udfyldt')
        return false       
        }
    alert('felt1 er udfyldt')
    }

-->
</script>

</head>

<body>
<div align="center">
<form name="test" method="get" onsubmit="tjek(this)" action="tjekform.asp">
<input name="felt1" >
<input type="submit" name="submit" value="opret">
</form> 
</div>
</body>
</html>
---
/erik
Avatar billede 2is Nybegynder
21. juli 2003 - 20:17 #29
det lød ikke pænt,"sag er det til at overskue"
der skulle ha stået "sag der er til at overskue"
Undskyld, det var en skrive fejl
/erik
Avatar billede roenving Novice
22. juli 2003 - 00:58 #30
Du _skal_ skrive den der return i onsubmit ...
<form name="test" method="get" onsubmit="return tjek(this)" action="tjekform.asp">
Avatar billede 2is Nybegynder
22. juli 2003 - 01:23 #31
Hej og tak (jeg kan nu se at det har du skrevet tidliger, men det har jeg først fattet nu)
jeg havde også nået at finde ud af det er "return" i onsubmit="return tjek(this)" jeg ikke har haft med , jeg tror det "lysner" nu.
Jeg har lagt et nyt forsøg ud på :
http://hjem.get2net.dk/isager/erik/validering/fejl.html
som jeg synes virker ok, er der noget der bør ændres/fjernes ting der ved første øjekast ser forkert ud, ellers tror jeg den er så jeg kan bruge den.

Venlig hilsen Erik Isager
Avatar billede roenving Novice
22. juli 2003 - 02:49 #32
Den sender stadig, så stop-funktionen mangler ved nogle af dine checks ...
Avatar billede 2is Nybegynder
23. juli 2003 - 00:22 #33
Jeg ved ikke om der er flere, men meningen er at navn SKAL udfyldes, hvis alle datofelter er tomme er det også OK, men er en dato gruppe påbegyndt skal den laves færdig.
/erik
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester