Søg
Avatar billede lund_dk Praktikant
28. august 2006 - 21:29 Der er 11 kommentarer og
1 løsning

Validering af brugernavn input felt

Nogen som kan hjælpe mig med at validere et formfelt som skal have følgende kriterier:

1. Kun bogstaver og tal (ikke special tegn & mellem)
2. Skal være mininum 4 tegn, og max 16
Avatar billede mcgoat Nybegynder
28. august 2006 - 21:43 #1
lille test:

<html>
<head>
<script language="javascript">
function Check(eventkey)
{
    if(eventkey.keyCode >= 48 && eventkey.keyCode <= 57 || eventkey.keyCode >= 65 && eventkey.keyCode <= 90 || eventkey.keyCode == 46 || eventkey.keyCode == 8 || eventkey.keyCode == 13 || eventkey.keyCode == 37 || eventkey.keyCode == 39)
    {
        // 48 = 0, 57 = 9, 46 = Del, 8 = Backspace, 13 = Enter, 37 = Venstre Pil, 39 = Højre Pil, 65-90=a-z,
    }
    else
    {
        return false; // retuner false hvis andre taster
    }
}

function CheckLength()
{
        if(document.minform.searchfield.value.length >= 4 && document.minform.searchfield.value.length <= 16)
        {
            alert("Felt er >= 4 & <= 16");
        }
        else
        {
            alert("Felt er < 4 eller > 16");
        }
}
</script>
</head>
<body>
<form name="minform">
<input type="text" name="searchfield" onKeyDown="return Check(event)"><input type="button" name="checklenght" onClick="CheckLength();" value="Test">
</form>
</body>
</html>
Avatar billede mcgoat Nybegynder
28. august 2006 - 21:46 #2
input feltet er så lavet så man KUN kan bruge tasterne: a-z, 0-9, del, backspace, enter, piletaster.

knappen tjekker om længden er rigtig
Avatar billede lund_dk Praktikant
28. august 2006 - 21:59 #3
Kan du hjælpe mig med at flette det ind i min nuværende validering ?


<script type="text/javascript">

function validering()
  {
  error = 0;
 
 
 
       
  if((document.forms[0].fornavn.value=='') && (error==0)) 
  {       
    alert('Du skal udfylde feltet med dit brugernavn!');
    document.forms[0].fornavn.focus();
    error = 1;       
  }   
       

  if(error == 0)
  document.forms[0].submit();   
  }

</script>
Avatar billede mclemens Nybegynder
28. august 2006 - 22:05 #4
husk ctrl+v, højre muse knap og sæt ind - samt rediger menuen og sæt ind ...



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">
function val(tn){
  if(tn.value.match(/\W/))tn.value=tn.value.replace(/\W/g,"");
  if(tn.value.length>16)tn.value=tn.value.substr(0,16);
}
</script>

</head><body>

<input type="text" onkeyup="val(this);" onchange="val(this);">

</body></html>
Avatar billede mclemens Nybegynder
28. august 2006 - 22:21 #5
Hvad med:




<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">

ugyldtegnalert="Der var ugyldige tegn i feltet disse er fjernet\n";
lengthalert="Brugernavn skal være mellem 4 og 16 tegn\ngyldige tegn er: a-z A-Z 0-9";

function val(tn){
  if(tn.value.match(/\W/)){tn.value=tn.value.replace(/\W/g,"");alert(ugyldtegnalert+lengthalert);return true;}
  else if(tn.value.length>16){tn.value=tn.value.substr(0,16);alert(lengthalert);return true;}
  else return false;
}



function validering(f)  {

  error=false;

  error=val(f.fornavn);

  if((!error)&&(f.fornavn.value.length<4)){error=true;alert(lengthalert);f.fornavn.focus();}

  return (!error);

}



</script>

</head><body>

<form method="get" action="test.html" onsubmit="return validering(this);">

<input type="text" name="fornavn" onkeyup="val(this);" onchange="val(this);">
<input type="submit" value="ok">
</form>
</body></html>
Avatar billede mclemens Nybegynder
28. august 2006 - 22:24 #6
ret lige denne linje:  if(tn.value.match(/\W/)){tn.value=tn.value.replace(/\W/g,"");alert(ugyldtegnalert+lengthalert);return true;}
til:
  if(tn.value.match(/[\W_]/)){tn.value=tn.value.replace(/[\W_]/g,"");alert(ugyldtegnalert+lengthalert);return true;}

(ellers var _ også tilladt)
Avatar billede lund_dk Praktikant
28. august 2006 - 22:39 #7
Jeg har smidt det ind sådan her, men hvad gør jeg galt?

<script type="text/javascript">
function Check(eventkey)
{
    if(eventkey.keyCode >= 48 && eventkey.keyCode <= 57 || eventkey.keyCode >= 65 && eventkey.keyCode <= 90 || eventkey.keyCode == 46 || eventkey.keyCode == 8 || eventkey.keyCode == 13 || eventkey.keyCode == 37 || eventkey.keyCode == 39)
    {
        // 48 = 0, 57 = 9, 46 = Del, 8 = Backspace, 13 = Enter, 37 = Venstre Pil, 39 = Højre Pil, 65-90=a-z,
    }
    else
    {
        return false; // retuner false hvis andre taster
    }
}



function validering()
  {
  error = 0;
 

       
     
 
        if((document.forms[0].brugernavn.value.length <= 4 && document.forms[0].brugernavn.value.length >= 16)  && (error==0))
        {
            alert("Dit brugernavn skal være mellem 4 og 16 tegn.");
            document.forms[0].brugernavn.focus();
            error = 1;
        }
       
        if((document.forms[0].fornavn.value=='') && (error==0)) 
          {       
            alert('Du skal udfylde feltet med dit brugernavn!');
            document.forms[0].fornavn.focus();
            error = 1;       
          }


       

  if(error == 0)
  document.forms[0].submit();   
  }

</script>
Avatar billede mclemens Nybegynder
28. august 2006 - 22:52 #8
Kaster lige en anden udgave af min ...
som passer mere overens med dit script ...
teksterne kan selvfølgelig bare rettes ...
((( hvis det er så kalder du )))



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">

ugyldtegnalert="Der var ugyldige tegn i feltet disse er fjernet\n";
lengthalert="Brugernavn skal være mellem 4 og 16 tegn\ngyldige tegn er: a-z A-Z 0-9";

function val(tn){
  if(tn.value.match(/[\W_]/)){tn.value=tn.value.replace(/[\W_]/g,"");alert(ugyldtegnalert+lengthalert);return true;}
  else if(tn.value.length>16){tn.value=tn.value.substr(0,16);alert(lengthalert);return true;}
  else return false;
}



function validering()  {

  f=document.forms[0];

  error=false;

  error=val(f.fornavn);

  if((!error)&&(f.fornavn.value.length<4)){error=true;alert(lengthalert);f.fornavn.focus();}

  if(!error)document.forms[0].submit();

}



</script>

</head><body>

<form method="get" action="test.html">
<input type="text" name="fornavn" onkeyup="val(this);" onchange="val(this);">
</form>

<br><br><br><br><br>

<b onclick="validering();">afsend</b>
</body></html>
Avatar billede lund_dk Praktikant
28. august 2006 - 22:56 #9
mclemens: Er ny i javascript, og metoden du bruger syntes jeg er lidt svært at gennemskue.. Derfor ville jeg gerne det kunne smides ind i den metode jeg bruger, så jeg nemmere kan gennemskue det, for skal have tilføjet bagefter alle mulige andre elementer.
Avatar billede mclemens Nybegynder
28. august 2006 - 23:15 #10
[ Er ny i javascript ] Jep, det er jeg også (startede med træning i marts).

[ og metoden du bruger syntes jeg er lidt svært at gennemskue.. ] Hvis man skal have en forklaring er det bare at spørge ...

<input type="text" name="fornavn" onkeyup="val(this);" onchange="val(this);">
^ - hver gang knappen ryger op eller værdien af input feltet ændres køres valideringen

  if(tn.value.match(/[\W_]/)){tn.value=tn.value.replace(/[\W_]/g,"");alert(ugyldtegnalert+lengthalert);return true;}
^ - hvis input feltet indeholder tegn der ikke er i 0-9a-zA-Z eller hvis tegnet er _ køres replace funktionen der sletter tegnene og giver brugeren en alert ...

  else if(tn.value.length>16){tn.value=tn.value.substr(0,16);alert(lengthalert);return true;}
^ - denne her checker tegn længden (hvis den er over kommer der en alert og længden sænkes ... else gør at funktionen kun køres hvis den anden fejl ikke opstod
  else return false;
^ - hvis der ikke kom nogle fejl returnerer den false ellers true.




<b onclick="validering();">afsend</b>
^ - ved submit køres validerings funktionen


function validering()  {

  f=document.forms[0];
- en genvej til formularen

  error=false;
- error sættes til false ... det lyder dumt at arbejde med error true og så afsende hvis error er true ... derfor modsat falsk / sand fortegn.
  error=val(f.fornavn);
- error tildeles værdien funktionen her returnerer ... bemærk den retunerede false hvis der ikke var fejl - så error forbliver false hvis alt er ok
  if((!error)&&(f.fornavn.value.length<4)){error=true;alert(lengthalert);f.fornavn.focus();}
- hvis længden er under 4 returneres en fejl (validering på over er i den anden funktion

  if(!error)document.forms[0].submit();
- hvis error er false - altså hvis der ingen fejl var så submittes
}



[ Derfor ville jeg gerne det kunne smides ind i den metode jeg bruger, ]
Ok, men synes det virkede mere overskueligt hver for sig... her:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">

ugyldtegnalert="Der var ugyldige tegn i feltet disse er fjernet\n";
lengthalert="Brugernavn skal være mellem 4 og 16 tegn\ngyldige tegn er: a-z A-Z 0-9";

function validering(t)  {

  f=document.forms[0];

  error=false;

  tn=f.fornavn;

  if(tn.value.match(/[\W_]/)){tn.value=tn.value.replace(/[\W_]/g,"");alert(ugyldtegnalert+lengthalert);error=true;}
  else if(tn.value.length>16){tn.value=tn.value.substr(0,16);alert(lengthalert);error=true;}

  if((!error)&&(f.fornavn.value.length<4)&&(t!=1)){error=true;alert(lengthalert);f.fornavn.focus();}

  if((!error)&&(!t))document.forms[0].submit();

}



</script>

</head><body>

<form method="get" action="test.html">
<input type="text" name="fornavn" onkeyup="validering(1);" onchange="validering(1);">
</form>

<br><br><br><br><br>

<b onclick="validering();">afsend</b>
</body></html>
Avatar billede mclemens Nybegynder
28. august 2006 - 23:29 #11
Men, jeg kan da godt se, at koden kan virke
forvirrende, hvis man lige er begyndt at js'e :)
Avatar billede lund_dk Praktikant
30. september 2006 - 12:57 #12
fik det aldrig til at virke 100%
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 16:04 Canon printer vil ikke udskrive farver Af mort1 i Printere
I går 14:50 Hvilket fabrikat af Mesh systemer virker? Af fkj i Wifi
15/0513:45 AJAX kode -javascript Af Asky i Programmeringsværktøjer
15/0511:50 Vælg indstilling - blå skærm med med flere muligheder for fejlretning Af Uvanga i Windows
14/0523:24 Google sheets beregning udfra dato Af rickiegrayholm i Office & Kontorpakker
White papers
Flere white papers »