/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Validering af html form
Fra : Peter Nicolaj


Dato : 28-05-11 10:36

Jeg har brug for validering af nedstående html-form:

Jeg har prøvet at anvende relevante scripts, fundet her på siden:
http://www.html.dk/scripts/javascript/

Jeg skal bruge validering af 1.tekstfelter 2.textarea's
3.radio-knapper samt 4.E-mail.

Det går fint med at indsætte dem enkeltvis. Men når jeg skal
sammensætte dem, går det galt.

Hvordan kan jeg lave mit javascript, så alle valideringerne kører
igennem? Altså hvordan sammemskriver jeg en kode, hvor de alle
indgår?

<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="da">
<head>
<title>TILMELDING TIL ÅBENTHUS</title>
<link rel="stylesheet" type="text/css" href="style/style.css">

</head>

<body>
<table width="634" align="center"><tr><td>
<img src="images/topbanner_tilmelding.jpg"/>

<h4>TILMELDING TIL ÅBENTHUS</h4>

<div id="baggrund"><div id="margin">


<form action="process.php" method="post"
onsubmit="validering();return false;">

<p><b>Ja tak</b> - jeg ser frem til at lære Erik at kende og jeg
vil meget gerne dele mine møbel ideer til<br />gensidig
inspiration.</p>
<p><b>Marker ønsket dato:</b></p>
<INPUT TYPE=RADIO NAME="Dag" VALUE="lørdag"><b> lørdag d. 18.
juni kl. 13-17</b><br /><br />
<INPUT TYPE=RADIO NAME="Dag" VALUE="søndag"><b> Søndag d. 19.
juni kl. 13-17</b><br />

<br>

<p>Vi har et <u>begrænset antal pladser</u> - hurtig tilmelding
tilrådes.</p>

<p>For at sikre den bedst mulige oplevelse for den enkelte
deltager, vil vi ved stor søgning gennemføre åbenthus
arrangementet to gange på dagen
(vi giver udførlig information, hvis det besluttes).<br /><br />
<b>Hvis arrangementet deles i to, vil jeg helst deltage:</b></p>
<INPUT TYPE=RADIO NAME="Starttid" VALUE="13-15"><b> Kl.
13-15</b><br /><br />
<INPUT TYPE=RADIO NAME="Starttid" VALUE="15-17"><b> Kl.
15-17</b><br /><br /><br />

<small>(*Alle felter skal udfyldes)</small><br /><br />
<b>Navn:</b><small>*</small><br /> <input type="text"
name="Fornavn" style="background:#ded6c9; color:black;>
<input type="hidden" name="time" value=""><br /><br />
<b>Efternavn:</b><small>*</small><br /> <input type="text"
name="Efternavn" style="background:#ded6c9; color:black;><br
/><br />
E-mail2:<br> <input type="text" name = ""><br /><br />
<b>E-mail:</b><small>*</small> <br /><input type="text" name =
"Email" style="background:#ded6c9; color:black;><br /><br />
E-mail2:<br> <input type="text" name = ""><br /><br />
<b>Gentag e-mail:</b><small>*</small><br /><input type="text"
name = "" style="background:#ded6c9; color:black;><br><br><br>



<div align="center"><br><br>

<b>Tlf.:</b><small>*</small><br> <input type="text"
name="Telefon" size="6" maxlength="8" style="background:#ded6c9;
color:black; name="Telefon" ><br><br>
<b>Postnr:</b><small>*</small><br> <input type="text"
name="Postnr" size="1" maxlength="4" style="background:#ded6c9;
color:black; name="Postnr" ><br><br>


<b>Hvor har du hørt/ læst om
arrangementerne:</b><small>*</small><br />
<TEXTAREA NAME="Medie" COLS=40 ROWS=2 style="background:#ded6c9;
color:black; name="Medie"></TEXTAREA><br /><br />


<p>Vi vil gerne forberede os bedst muligt – og derfor skabe os et
billede af, hvor mange, der har egne idéer med:</p><br />
<INPUT TYPE=RADIO NAME="Produkt" VALUE="ja"><b>Ja – jeg har egen
idé med (noter kort beskrivelse nedenfor)</b><br /><br />
<INPUT TYPE=RADIO NAME="Produkt" VALUE="nej"><b>Nej – jeg har
ikke en produktidé med, men bidrager med min aktive
deltagelse</b><br /> <br />
<b>Beskrivelse af produkt:</b> <small>(max 250 tegn)</small><br
/>
<TEXTAREA NAME="Produktbeskrivelse" maxlength="250" COLS=40
ROWS=6 style="background:#ded6c9; color:black;
NAME="Produktbeskrivelse"></TEXTAREA><br /><br /><br />

<b>Jeg er specielt interesseret i at høre om:</b> <small>(max 250
tegn)</small><br />
<TEXTAREA NAME="Produktinteresse" maxlength="250" COLS=40 ROWS=6
style="background:#ded6c9; color:black;
NAME="Produktinteresse"></TEXTAREA><br /><br />



<br /><br />
</p>

<input type="submit" value="Send tilmelding">

</form>


<br /><br /><br />
</div></div></div>

</body></html>

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
Martin Ploug (28-05-2011)
Kommentar
Fra : Martin Ploug


Dato : 28-05-11 11:49

Peter Nicolaj wrote:
> Jeg har brug for validering af nedstående html-form:
>
> Jeg har prøvet at anvende relevante scripts, fundet her på siden:
> http://www.html.dk/scripts/javascript/
>
> Jeg skal bruge validering af 1.tekstfelter 2.textarea's
> 3.radio-knapper samt 4.E-mail.
>
> Det går fint med at indsætte dem enkeltvis. Men når jeg skal
> sammensætte dem, går det galt.
>
> Hvordan kan jeg lave mit javascript, så alle valideringerne kører
> igennem? Altså hvordan sammemskriver jeg en kode, hvor de alle
> indgår?
>
> <!DOCTYPE html PUBLIC
> "-//W3C//DTD XHTML 1.0 Transitional//EN"
> "http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
>
> <html xmlns="http://www.w3.org/1999/xhtml" lang="da">
> <head>
> <title>TILMELDING TIL ÅBENTHUS</title>
> <link rel="stylesheet" type="text/css" href="style/style.css">
>
> </head>
>
> <body>
> <table width="634" align="center"><tr><td>
> <img src="images/topbanner_tilmelding.jpg"/>
>
> <h4>TILMELDING TIL ÅBENTHUS</h4>
>
> <div id="baggrund"><div id="margin">
>
>
> <form action="process.php" method="post"
> onsubmit="validering();return false;">
>
> <p><b>Ja tak</b> - jeg ser frem til at lære Erik at kende og jeg
> vil meget gerne dele mine møbel ideer til<br />gensidig
> inspiration.</p>
> <p><b>Marker ønsket dato:</b></p>
> <INPUT TYPE=RADIO NAME="Dag" VALUE="lørdag"><b> lørdag d. 18.
> juni kl. 13-17</b><br /><br />
> <INPUT TYPE=RADIO NAME="Dag" VALUE="søndag"><b> Søndag d. 19.
> juni kl. 13-17</b><br />
>
> <br>
>
> <p>Vi har et<u>begrænset antal pladser</u> - hurtig tilmelding
> tilrådes.</p>
>
> <p>For at sikre den bedst mulige oplevelse for den enkelte
> deltager, vil vi ved stor søgning gennemføre åbenthus
> arrangementet to gange på dagen
> (vi giver udførlig information, hvis det besluttes).<br /><br />
> <b>Hvis arrangementet deles i to, vil jeg helst deltage:</b></p>
> <INPUT TYPE=RADIO NAME="Starttid" VALUE="13-15"><b> Kl.
> 13-15</b><br /><br />
> <INPUT TYPE=RADIO NAME="Starttid" VALUE="15-17"><b> Kl.
> 15-17</b><br /><br /><br />
>
> <small>(*Alle felter skal udfyldes)</small><br /><br />
> <b>Navn:</b><small>*</small><br /> <input type="text"
> name="Fornavn" style="background:#ded6c9; color:black;>
> <input type="hidden" name="time" value=""><br /><br />
> <b>Efternavn:</b><small>*</small><br /> <input type="text"
> name="Efternavn" style="background:#ded6c9; color:black;><br
> /><br />
> E-mail2:<br> <input type="text" name = ""><br /><br />
> <b>E-mail:</b><small>*</small> <br /><input type="text" name =
> "Email" style="background:#ded6c9; color:black;><br /><br />
> E-mail2:<br> <input type="text" name = ""><br /><br />
> <b>Gentag e-mail:</b><small>*</small><br /><input type="text"
> name = "" style="background:#ded6c9; color:black;><br><br><br>
>
>
>
> <div align="center"><br><br>
>
> <b>Tlf.:</b><small>*</small><br> <input type="text"
> name="Telefon" size="6" maxlength="8" style="background:#ded6c9;
> color:black; name="Telefon"><br><br>
> <b>Postnr:</b><small>*</small><br> <input type="text"
> name="Postnr" size="1" maxlength="4" style="background:#ded6c9;
> color:black; name="Postnr"><br><br>
>
>
> <b>Hvor har du hørt/ læst om
> arrangementerne:</b><small>*</small><br />
> <TEXTAREA NAME="Medie" COLS=40 ROWS=2 style="background:#ded6c9;
> color:black; name="Medie"></TEXTAREA><br /><br />
>
>
> <p>Vi vil gerne forberede os bedst muligt – og derfor skabe os et
> billede af, hvor mange, der har egne idéer med:</p><br />
> <INPUT TYPE=RADIO NAME="Produkt" VALUE="ja"><b>Ja – jeg har egen
> idé med (noter kort beskrivelse nedenfor)</b><br /><br />
> <INPUT TYPE=RADIO NAME="Produkt" VALUE="nej"><b>Nej – jeg har
> ikke en produktidé med, men bidrager med min aktive
> deltagelse</b><br /> <br />
> <b>Beskrivelse af produkt:</b> <small>(max 250 tegn)</small><br
> />
> <TEXTAREA NAME="Produktbeskrivelse" maxlength="250" COLS=40
> ROWS=6 style="background:#ded6c9; color:black;
> NAME="Produktbeskrivelse"></TEXTAREA><br /><br /><br />
>
> <b>Jeg er specielt interesseret i at høre om:</b> <small>(max 250
> tegn)</small><br />
> <TEXTAREA NAME="Produktinteresse" maxlength="250" COLS=40 ROWS=6
> style="background:#ded6c9; color:black;
> NAME="Produktinteresse"></TEXTAREA><br /><br />
>
>
>
> <br /><br />
> </p>
>
> <input type="submit" value="Send tilmelding">
>
> </form>
>
>
> <br /><br /><br />
> </div></div></div>
>
> </body></html>
>

Har du et link til siden?
Jeg mener, at du imellem <head> og </head> skal have tilføjet nogle
variable for de enkelte felter.

altså noget <script>

function validering() {

...... dine valideringer
if (.....et eller andet ikke er opfyldt...) {
alert("Feltet ... er ikke udfyldt koreekt ");
return false;
}

}

Sune Storgaard (28-05-2011)
Kommentar
Fra : Sune Storgaard


Dato : 28-05-11 12:50

Den 28-05-2011 11:36, Peter Nicolaj skrev:
> Jeg har brug for validering af nedstående html-form:
>
> Jeg har prøvet at anvende relevante scripts, fundet her på siden:
> http://www.html.dk/scripts/javascript/

En plan B:
http://www.jotform.com/
Der er det rimelig nemt at lave en form, og vælge hvilke kriterier hvert
felt kan/må/skal have. Kan altid finpudses bagefter når koden er generet.


Martin Ploug (28-05-2011)
Kommentar
Fra : Martin Ploug


Dato : 28-05-11 13:39

Sune Storgaard wrote:
> Den 28-05-2011 11:36, Peter Nicolaj skrev:
>> Jeg har brug for validering af nedstående html-form:
>>
>> Jeg har prøvet at anvende relevante scripts, fundet her på siden:
>> http://www.html.dk/scripts/javascript/
>
> En plan B:
> http://www.jotform.com/
> Der er det rimelig nemt at lave en form, og vælge hvilke kriterier hvert
> felt kan/må/skal have. Kan altid finpudses bagefter når koden er generet.
>

Hej Sune

Tak for tippet. Den tror jeg da selv jeg vil benytte mig af

Martin Ploug (28-05-2011)
Kommentar
Fra : Martin Ploug


Dato : 28-05-11 13:52

Martin Ploug wrote:
> Sune Storgaard wrote:
>> Den 28-05-2011 11:36, Peter Nicolaj skrev:
>>> Jeg har brug for validering af nedstående html-form:
>>>
>>> Jeg har prøvet at anvende relevante scripts, fundet her på siden:
>>> http://www.html.dk/scripts/javascript/
>>
>> En plan B:
>> http://www.jotform.com/
>> Der er det rimelig nemt at lave en form, og vælge hvilke kriterier hvert
>> felt kan/må/skal have. Kan altid finpudses bagefter når koden er generet.
>>
>
> Hej Sune
>
> Tak for tippet. Den tror jeg da selv jeg vil benytte mig af

Kan man på en eller anden måde kopiere kildekoden til sine egne dokumenter?
I FAQ'en står der at man kan klikke på Share, men den kan jeg ikke
se.

Martin Ploug (28-05-2011)
Kommentar
Fra : Martin Ploug


Dato : 28-05-11 14:01

Martin Ploug wrote:
> Martin Ploug wrote:
>> Sune Storgaard wrote:
>>> Den 28-05-2011 11:36, Peter Nicolaj skrev:
>>>> Jeg har brug for validering af nedstående html-form:
>>>>
>>>> Jeg har prøvet at anvende relevante scripts, fundet her på siden:
>>>> http://www.html.dk/scripts/javascript/
>>>
>>> En plan B:
>>> http://www.jotform.com/
>>> Der er det rimelig nemt at lave en form, og vælge hvilke kriterier hvert
>>> felt kan/må/skal have. Kan altid finpudses bagefter når koden er
>>> generet.
>>>
>>
>> Hej Sune
>>
>> Tak for tippet. Den tror jeg da selv jeg vil benytte mig af
>
> Kan man på en eller anden måde kopiere kildekoden til sine egne dokumenter?
> I FAQ'en står der at man kan klikke på Share, men den kan jeg ikke
> se.

Aha, det er under Opsætning & Integrer. Det er ret smart.
Det må prøves

Birger Sørensen (28-05-2011)
Kommentar
Fra : Birger Sørensen


Dato : 28-05-11 16:05

Peter Nicolaj skrev den 28-05-2011:
> Jeg har brug for validering af nedstående html-form:
>
> Jeg har prøvet at anvende relevante scripts, fundet her på siden:
> http://www.html.dk/scripts/javascript/
>
> Jeg skal bruge validering af 1.tekstfelter 2.textarea's
> 3.radio-knapper samt 4.E-mail.
>
> Det går fint med at indsætte dem enkeltvis. Men når jeg skal
> sammensætte dem, går det galt.
8X

Et link siger mere end 1000 ord, og nok så mange kildekoder...

Og html.dk er næppe det rigtige sted at blive klogere. Det var det
engang i forrige århundrede - i dag er det et sted der laver gratis
arbejde i nyhedgrupperne om til reklamepenge, til nogle få mennesker,
der ikke kerer sig om at de vildleder andre med forældede koder. Sitet
burde enten fjernes eller opdateres.

Først af alt, skal validering foregå serverside (i dit tilfælde i
process.php). Selvom du validerer i js clientside, kan det der sendes
manipuleres, så der er ingen sikkerhed. Validering clientside, er
udelukkende brugervenlighed.
Dernæst ville jeg validere i de enkelte elementers onchange. Så får man
fejlene efterhånden som de kommer.
Ved at give dine input et id (som godt kan være det samme som name),
kan du i js både hente værdier der skal testes, og sætte fokus til de
steder, der optræder fejl.
Endelig kan man godt gentage valideringen i onsubmit på formen, som du
gør - ved ganske enkelt at kalde de enkelte valideringsrutiner efter
tur.

Måske burde du også lige overveje at validere XHTML'en, inden du kaster
dig over funktionsproblemer. Der er dele af det, som umuligt kan
validere i XHTML - og når det ikke validerer, kan der være mange
årsager til at tingene ikke virker...

Og så et link i stedet for kildekode. Jeg har ikke tid til at sætte
tingene op, så jeg kan se dem i mine værktøjer - og jeg tror heller
ikke andre har. Men det kan vi med link.

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Peter Nicolaj (29-05-2011)
Kommentar
Fra : Peter Nicolaj


Dato : 29-05-11 06:54

Tak for svar...

Det lykkedes nogenlunde at sætte de forskellige valideringer sammen.
Det kan absolut blive bedre, men tiden er knap, og det vigtigste er at
bruger får indtastet i de nødvendige felter.

Den form "generator" der bliver linket til er lidt interessant. Den skal
jeg kigge på næste gang.

Nu vi er ved det, er der så nogen der har et bud på hvordan man laver en
"Gentag E-mail" funktion. Brugerens e-mail er den vigtigste info i dette
tilfælde, så hvis det kan afhjælpe forkerte addresse-indtastninger, vil
dettte være meget brugbart.



--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Birger Sørensen (29-05-2011)
Kommentar
Fra : Birger Sørensen


Dato : 29-05-11 08:37

Peter Nicolaj forklarede:
> Tak for svar...
>
> Det lykkedes nogenlunde at sætte de forskellige valideringer sammen.
> Det kan absolut blive bedre, men tiden er knap, og det vigtigste er at
> bruger får indtastet i de nødvendige felter.
>
> Den form "generator" der bliver linket til er lidt interessant. Den skal
> jeg kigge på næste gang.
>
> Nu vi er ved det, er der så nogen der har et bud på hvordan man laver en
> "Gentag E-mail" funktion. Brugerens e-mail er den vigtigste info i dette
> tilfælde, så hvis det kan afhjælpe forkerte addresse-indtastninger, vil
> dettte være meget brugbart.

Stadig ikke noget link?
Hvad sagde valideringen?
En input mere til at gentage email adressen. Sammenlign de to
indtastninger...

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Peter Nicolaj (29-05-2011)
Kommentar
Fra : Peter Nicolaj


Dato : 29-05-11 14:18

Ja, jeg kan godt regne ud jeg skal sammenligne de to værdier. Men hvordan?

Der lægger ikke noget link her, da jeg ikke vil risikere at nogen begynder at
registrere sig på databasen. Der sidder nogle og kører test på den.

Jeg kan godt se problemet med valideringen af mit html-kode. Har rettet noget
af den. Må så huske det til næste gang.

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Søg
Reklame
Statistik
Spørgsmål : 177577
Tips : 31968
Nyheder : 719565
Indlæg : 6409071
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste