Avatar billede nemlig Professor
18. august 2009 - 16:51 Der er 14 kommentarer og
1 løsning

Validering af et klokkeslæt-felt

Hejsa.
Jeg har et klokkeslæt felt, hvor jeg lige nu har noget PHP-validering på, men som ikke virker 100%.

Kravet er, at der skal indtastes i dette format: tt:mm, fx. "09:15"
Men det skal også være OK, at indtaste "9:15".
Og endelig, hvis der fx. alene skrives 9 og feltet forlades, vil det være rigtigt smart, hvis felt-indholdet automatisk rettes til "09:00".
Nogen der har link eller opskrift på denne udfordring.
Avatar billede kdasummer Nybegynder
18. august 2009 - 18:19 #1
umiddelbart ville jeg bruge et af de utallige frameworks der er tilgængelige. her er den slags validering nærmest klaret på forhånd. når først du har lært et javascript framework kigger du aldrig tilbage :)
Avatar billede nemlig Professor
18. august 2009 - 18:40 #2
Det er et godt forslag du kommer med, og som jeg vil sætte mig mere ind i, når tiden er lidt bedre.
Lige nu søger jeg en specifik løsning, og håber på nogle mere konkrete bidrag.
Avatar billede kdasummer Nybegynder
18. august 2009 - 18:52 #3
her er løsningen: http://www.daltonfilho.com/2008/01/20/javascript-time-validation-explained/

hvis du bruger regular expressions til at validere med, så kan du bruge dette som både tillader 01:01:01 og 1:1:1:
^((\d)|(0\d)|(1\d)|(2[0-3]))\:((\d)|([0-5]\d))\:((\d)|([0-5]\d))$
Avatar billede nemlig Professor
18. august 2009 - 19:16 #4
Linket forklarer vel kun, hvordan der kontrolleres for korrekt indhold i feltet. Og det er fint - det blev jeg klogere af.
Men.....
Hvis jeg fx. blot skriver "9" og hopper ud af feltet, så skal feltindholdet ændrer sig til "09:00".
Avatar billede kdasummer Nybegynder
18. august 2009 - 19:30 #5
ok, så er regular expressions udelukket. du skal trække tallene ud for hver : i input-feltet så og lave tjek på det, og derefter sætte 0 ind alt efter om de er over eller under 9. jeg fandt noget på codeproject der forklarede hvordan man adskiller det så du kan ændre koden til at tilføje 0 - prøv at søge efter javascript time validation på google.
Avatar billede nemlig Professor
18. august 2009 - 19:54 #6
Har prøvet, men det er ikke lykkedes at finde noget, som formatere feltindholdet, når feltet forlades.
Avatar billede kdasummer Nybegynder
18. august 2009 - 21:36 #7
Her er løsningen på alle dine problemer skrevet af summer himself:
------------------
<html>
<head>

<script language="JavaScript">

function timeValidator(timeStr) {
    var formattedTime = new String();
    var timeSep = timeStr.split(':', 3);
    var hour = timeSep[0];
    var minute = timeSep[1];
    var second = timeSep[2];
   
    var isValid = true;
   
    if(second == null)
        second = '00';
   
    if(hour > 23 || hour == null || minute < 0)
        isValid = false;
   
    if(minute > 59 || minute == null || minute < 0)
        isValid = false;
   
    if(second > 59 || second < 0)
        isValid = false;
   
    if(!isValid) {
        alert('Tiden er ikke angivet i korrekt format! (00:00:00)');
    } else {
   
        if(hour < 10 && hour.length == 1)
            formattedTime = '0';
        formattedTime += hour + ':';
   
        if(minute < 10 && minute.length == 1)
            formattedTime += '0';
        formattedTime  += minute + ':';
   
        if(second < 10 && second.length == 1)
            formattedTime += '0'
        formattedTime += second;
       
        document.timeform.time.value = formattedTime;
    }
}
</script>
</head>

<body>

<center>
<form name=timeform>
<input type=text name=time onBlur="timeValidator(document.timeform.time.value);"><br>
</form>
</center>
-------------------

jeg er sikker på at der er ting der kunne skrives bedre, men det her skulle få dig i gang.
Avatar billede olebole Juniormester
18. august 2009 - 22:35 #8
<ole>

To selects - én med timer og én med minutter = altid korrekt format og aldrig en bruger i tvivl om formatet  =)

/mvh
</bole>
Avatar billede olebole Juniormester
18. august 2009 - 22:35 #9
- og husk forøvrigt, at mange bruger et punktum til at skille timer og minutter  ;o)
Avatar billede nemlig Professor
18. august 2009 - 22:56 #10
Så begynder det at ligne noget, men.......
Mit tidsformat er tt:mm (ingen sekunder).

Tanken er, at hvis der blot skrives "9" i feltet, så skal indholdet rettes til "09:00" når feltet forlades.

Kan I hjælpe med dette.

Om skilletegnet er punktum eller kolon er ikke så afgørende.
Kolon er lidt nemmere, da jeg sætter klokken sammen med en dato og smider det i MySQL.
Avatar billede kdasummer Nybegynder
18. august 2009 - 23:47 #11
så fjerner du bare den del hvor sekunderne sættes ind og valideres. og i stedet for:
if(second == null)
        second = '00';

så skriver du
if(minute == null)
        minute = '00';

du bør læse en bog om javascript hvis det er problematisk.
Avatar billede kdasummer Nybegynder
19. august 2009 - 00:49 #12
<html>
<head>

<script language="JavaScript">

function timeValidator(timeStr) {
    var formattedTime = new String();
    var timeSep = timeStr;
    //Erstat alle punktummer med kolon.
    timeSep = timeSep.replace(/\./g, ':');
    //Split timer og minutter fra hinanden
    timeSep = timeSep.split(':', 2);
   
    var hour = timeSep[0];
    var minute = timeSep[1];
   
    var isValid = true;
   
    //Hvis ikke der er angivet minutter, så går vi ud fra det skal være 00.
    if(minute == null || minute == '')
        minute = '00';
   
    //isNaN = is Not a Number. Funktionen returnerer altså true hvis det ikke er et tal
    //(og det er jo det eneste vi vil arbejde med her, så hvis der bliver returneret true,
    //sættes isValid til false.)
    if(isNaN(hour) || isNaN(minute))
        isValid = false;
   
    //Vi tjekker om tallene stemmer overens med et tidsformat vi kender.
    if(hour > 23 || hour == null || hour < 0)
        isValid = false;
   
    if(minute > 59 || minute == null || minute < 0)
        isValid = false;
   
    if(!isValid) {
        alert('Tiden er ikke angivet i korrekt format! (00:00)');
    } else {
        //Hvis der er angivet et tal under 10 sikrer vi os, at der kommer et nul foran
        if(hour < 10 && hour.length == 1)
            formattedTime = '0';
        formattedTime += hour + ':';
   
        if(minute < 10 && minute.length == 1)
            formattedTime += '0';
        formattedTime  += minute;
       
        document.timeform.time.value = formattedTime;
    }
}
</script>
</head>

<body>

<center>
<form name=timeform>
<input type=text name=time onBlur="timeValidator(document.timeform.time.value);"><br>
</form>
</center>
Avatar billede nemlig Professor
19. august 2009 - 07:52 #13
Så er målet nået ift. mit spørgsmål.
Tak for bidragene og specielt tak til kdasummer, som oven i købet leverede færdig kode med forklaringer.
Avatar billede nemlig Professor
19. august 2009 - 08:00 #14
Jeg har oprettet et spørgsmål mere, da jeg godt kunne tænke mig et par finesser mere på denne kode:

http://www.eksperten.dk/spm/884062
Avatar billede nemlig Professor
17. oktober 2009 - 20:04 #15
Må jeg stille et spørgsmål mere til koden i #12.
Hvordan kan jeg bruge denne funktion på flere input-felter.
Jeg kan kun få koden til at virke, hvis jeg kalder input feltet for "name=time".
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