12. marts 2004 - 17:12Der er
27 kommentarer og 2 løsninger
Formular validering
Hej. Vidste ikke lige hvilken kategori der ville være bedst og nemmest til dette spørgsmål. Prøver her.
Nå men jeg har en formular, som sender data til en database. I denne formular vil jeg gerne validere hvert felt inden data bliver sendt videre til database. Nu får jeg fejl hvis datatypen ikke passer. Min formular ser ud ala dette:
Her hvordan jeg godt kunne tænke mig felterne blev valideret:
nr: kun tal(heltal) Fornavn: kun tekst(ikke tal og tegn, ved ikke om bindestreg skal med) Efternavn: kun tekst(ikke tal og tegn) Email: skal indeholde @(og måske andre kriterier, ved ikke lige hva) Tal1: kun tal(heltal) max 3, og ikke over en værdi på 500 Tal2: kun tal(heltal) max 3, og ikke over en værdi på 500 og ikke under en værdi på 80
Så havde jeg tænkt at hvis ét eller flere felter ikke var udfyldt konrekt, ville man få at vide at du kun må bruge f.eks tal i Tal1-feltet og husk evt. @ ved email-feltet. De andre data i formular vil stadig stå der.
Jeg ved ikke om dette kan lade sig gøre, men synes jeg har set noget ala dette andre steder.
<script language="javascript"> function validform(theform) { var ok_data = true; var filter = /^\d+(1,})?$/; if (filter.test(theform.nr.value) == false) { alert("nr skal være et tal"); ok_data = false; } var filter = /^([a-zæøå]){1,}$/; if (filter.test(theform.fornavn.value) == false) { alert("fornavn skal udfyldes."); ok_data = false; } if (filter.test(theform.efternavn.value) == false) { alert("efternavn skal udfyldes."); ok_data = false; } if(!theform.email.value.match(/^[\w]{1}[\w\.\-_]*@[\w]{1}[\w\-_\.]*\.[\w]{2,6}$/i)) { alert("email adresse skal være gyldig"); ok_data = false; } var filter = /^\d+(1,3})?$/; if (filter.test(theform.tal1.value) == false || theform.tal1.value > 500 || theform.tal1.value < 0) { alert("tal1 skal være mindre 500"); ok_data = false; } var filter = /^\d+(2,3})?$/; if (filter.test(theform.tal2.value) == false || theform.tal2.value > 500 || theform.tal2.value < 80) { alert("tal2 skal være imellem 80 og 500"); ok_data = false; }
JavaScript er klientside, dvs det vises i browseren.. og det der vises i browseren, kan downloades og ændres. Så man kan faktisk komme udenom din validering, hvis man downloader din form.
Det sikreste ville være, at lave den via ASP (serverside) :) Ja, det bliver lidt tungere på serveren, da den så skal lave mere.. men det er det sikreste.. og du kan også tilføje noget "referrer"-kode, så du kan se om brugeren kommer fra din side.
thesurfer, det er sikkert en god ide du nævner, men i mit tilfælde gør det ikke så meget. Hvis det skulle ske ville det kun gå ud over brugeren selv.
eagleeye, jeg har ikke lige nået at kigge så meget på det endnu, og hellere ikke testet det. Men hvad jeg lige kunne se ser det rigtigt fint ud(uden at kende det helt store til JS) men tror du har det hele med. Men for mig ser det lidt vildt ud :)
Jeg ved ikke om det kan gøres kort, men kan det forklares hvad de forskellige ting gør? (hvis, kan du få lidt ekstra point for det) bare så jeg måske har mulighed for at tilføje eller fjerne ting. F.eks ved: nr: var filter = /^\d+(1,})?$/; Fornavn: var filter = /^([a-zæøå]){1,}$/; email: (/^[\w]{1}[\w\.\-_]*@[\w]{1}[\w\-_\.]*\.[\w]{2,6}$/i)) tal1: var filter = /^\d+(1,3})?$/;
I din kode er der der taget højde for hvis nogle at felterne ikke bliver udfyldt? At den så f.eks skriver "Husk at skrive fornavn" Ellers vil jeg gerne give flere point for det.
-- jeg ville nok: email: (/^\w[\w\.\-_]*@\w[\w\-_\.]*\.\w{2,6}$/i))
-- og tilføjelserne til de ovennævnte koder:
\w betyder et word-tegn, som er et bogstav, et tal eller _ -- afhængig af brugerens landeopsætning kan det betyde specialkarakterer også (æøå, é ö osv.)
\. betyder et punktum, og det er nødvendigt, da . alene betyder et hvilkensomhelst tegn !-)
\- er brugt for at være sikker på, at der ikke kan forveksles med den omtalt ovenfor (a-z)
{2,6} betyder mindst 2 og højest 6 af det forudgående tegn (her \w altså mindst to og højest 6 ord-tegn !-)
Det virker fint. Der er lige et par ting jeg godt kunne tænke mig.
1. at der vurderes om alle felterne er tomme, eller om værdien er forkert. F.eks hvis NR er tomt, skrives der "du mangler at udfylde nr" Hvis man er kommet til at skrive bogstaver, skrives der: "Nr skal være tal" 2. at alle alert-erne bliver samlet til én alert-box, som f.eks her: http://privat.tdc.dk/internet/bredbaand/bestil/ 3. jeg havde lige glemt at det ville være godt at validere om folk havde checket en af to radio-knapper. 1 eller 2. Og der skal stå: husk at angive blabla. 4. ved valideringen af f.eks TAL2, skriver den uanset om værdien er for høj eller lav det samme. Kan man lave så den fortæller hvor fejlen ligger.
Jeg er rigtigt glad for det der er lavet endtil videre. Og roenving der kommer lige nogle point i din retning.
Jeg ved ikke hvad den samlet point-sum skal komme op på. Men jeg havde jo et spørgsmål til 100 point. Efterfølgende er der kommet en hel del på. Hvad synes I selv disse ting skal udgøre i point.
1. Jo det kan man 2. Jo det kan man 3. Man kunne sætte den ene som default, så behøves validering ikke 4. Nej, men den skriver imellem 80 og 500, så det jo relativt nemt selv at gemmenskue hvor fejlen er :) men det kan også laves.
Angående font tror jeg faktisk ikke man kan ændre på det eller sætte fed ind.
Jeg vil godt lave det men der går lige ½-1 time inden jeg får tid til det.
ok der gik lidt mere :) Her med 1,2,3,4 så vidt jeg lige kan se.
<html> <body>
<script language="javascript"> function validform(theform) { var ok_data = true; var tekst='';
if (theform.nr.value == '') { tekst += 'nr må ikke være tom\n'; ok_data = false; } else { var filter = /^\d+(1,})?$/; if (filter.test(theform.nr.value) == false) { tekst += 'nr skal være et tal\n'; ok_data = false; } } var filter = /^([a-zæøå]){1,}$/; if (theform.fornavn.value == '') { tekst += 'Fornavn skal udfyldes\n'; ok_data = false; } else { if (filter.test(theform.fornavn.value) == false) { tekst += 'Fornavn må kun indeholder bogstaver\n'; ok_data = false; } } if (theform.efternavn.value == '') { tekst += 'Efternavn skal udfyldes\n'; ok_data = false; } else { if (filter.test(theform.efternavn.value) == false) { tekst += 'efternavn skal udfyldes\n'; ok_data = false; } } if (theform.email.value == '') { tekst += 'E-mail skal udfyldes\n'; ok_data = false; } else { if(!theform.email.value.match(/^[\w]{1}[\w\.\-_]*@[\w]{1}[\w\-_\.]*\.[\w]{2,6}$/i)) { tekst += 'E-mail adresse skal være gyldig\n'; ok_data = false; } } if (theform.tal1.value == '') { tekst += 'tal1 skal udfyldes\n'; ok_data = false; } else { if (theform.tal1.value > 500) { tekst += 'tal1 skal være mindre end 500\n'; } if (theform.tal1.value < 0) { tekst += 'tal1 skal være større end 0\n'; } var filter = /^\d+(1,3})?$/; if (filter.test(theform.tal1.value) == false) { tekst += 'tal1 må kun indeholde tal\n'; ok_data = false; } } if (theform.tal2.value == '') { tekst += 'tal2 skal udfyldes\n'; ok_data = false; } else { if (theform.tal2.value > 500) { tekst += 'tal2 skal være mindre end 500\n'; } if (theform.tal2.value < 0) { tekst += 'tal2 skal være større end 80\n'; } var filter = /^\d+(2,3})?$/; if (filter.test(theform.tal2.value) == false) { tekst += 'tal2 må kun indeholde tal\n'; ok_data = false; } } if(!theform.ko[0].checked && !theform.ko[1].checked) { tekst += 'ko skal vælges, blabla\n'; ok_data = false; } if (ok_data==false) { alert(tekst); } return ok_data; } </script>
Okay, det virker jo ellers fint. Men det er rigtig at man ikke kunne bruge store bogstaver i navnene. Det er retttet nu. Jeg er ikke helt med på hvad du mener med (1,})? har ikke prøvet at slette det. Kan du ikke skrive hele linien jeg skal rette, kan ikke lige se mig ud af det.
Okay jeg synes det køre fint. Har ikke rettet det sidste. Ved i om man kan indsætte tomme/blanke linier i en arlert-box? Men kan I ikke ligge et svar så vi kan få delt nogle point ud.
if (+theform.tal2.value > 500) { tekst += 'tal2 skal være mindre end 500\n'; } if (+theform.tal2.value < 0) { tekst += 'tal2 skal være større end 80\n';
Det virker ikke. Hvis et af felterne ikke er udfyldt og det andet felt har en for lav/høj værdi, kommer beskeden godt nok. Men hvis begge felter er udfyldt forkert med for lav/høj værdi, accepteres værdierne og man sendes videre.
if (theform.tal2.value == '') { tekst += 'tal2 skal udfyldes\n'; ok_data = false; } else { if (+theform.tal2.value > 500) { tekst += 'tal2 skal være mindre end 500\n'; ok_data = false; } if (+theform.tal2.value < 80) { tekst += 'tal2 skal være større end 80\n'; ok_data = false; } var filter = /^\d+(2,3})?$/; if (filter.test(theform.tal2.value) == false) { tekst += 'tal2 må kun indeholde tal\n'; ok_data = false; } }
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.
