NOTESSIDAN

Allt om Lotus Notes & Domino




Validera alla typer av fält med javascript
Fältvalidering med Javascript kan vara tidsödande, här ett script som validerar alla olika typer av fält man kan ha på webben. (text,textarea,select-one,radio,select-multiple och checkbox)

Animationen visar hur jag tvingar användaren att fylla alla fält i ett formulär innan det postas till servern.

validation

Här är scriptet som gör valideringen

function valid( Fields, Messages)  { 
var frm = window.document.forms[0]; 
isValid = true; 
var strMsg = "Please enter value for these fields:\n\n"; 
for (var i=0; i<Fields.length ; i++) { 
        var FType=eval( 'frm.'+Fields[i]+'.type' ); 
        switch (FType) 
        { 
        case "text" : 
                if ( eval ( 'frm.'+Fields[i]+'.value' ) =='') { 
                        isValid = false; 
                        strMsg += "- " + Messages[i] +"\n"; 
                }
        break
        case "textarea" : 
        if ( eval ( 'frm.'+Fields[i]+'.value' ) =='') { 
                isValid = false; 
                strMsg += "- " + Messages[i] +"\n"; 
        }
        break
        case "select-one" : 
                chk = 'false'; 
                value = eval ( 'frm.'+Fields[i]+'.options[frm.'+Fields[i]+'.selectedIndex].text');
                if (value !='- Select -' && value != '' ) { 
                        chk = 'true'; 
                }
                if (chk=='false') { 
                        isValid = false; 
                        strMsg += "- " + Messages[i] +"\n"; 
                }
        break
        case "select-multiple": 
                if ( eval ( 'frm.'+Fields[i]+'.selectedIndex')==-1) { 
                        isValid = false; 
                        strMsg += "- " + Messages[i] +"\n"; 
                }
        break
        default: 
                  switch (eval ( 'frm.'+Fields[i]+'[0].type' ) ) { 
                case "radio" : 
                chk = 'false'; 
                for (var m=0;  m < eval ('frm.'+Fields[i]+'.length') ; m++) { 
                                 if ( eval ( 'frm.'+Fields[i]+'['+m +'].checked') ) { 
                                        chk = 'true'; 
                                }
               }
               if (chk=='false') { 
                                isValid = false; 
                                  strMsg += "- " + Messages[i] +"\n"; 
                        } 
                break
                case "checkbox": 
                        chk = 'false'; 
                        for (var m=0;  m < eval ('frm.'+Fields[i]+'.length') ; m++) { 
                                     if ( eval ( 'frm.'+Fields[i]+'['+m +'].checked') ) { 
                                                chk = 'true'; 
                                        }
                       }
                       if (chk=='false') { 
                                        isValid = false; 
                                        strMsg += "- " + Messages[i] +"\n"; 
                        } 
                break
                      }   
       }   
}
if (!isValid) alert(strMsg + "\n"); 
return isValid; 
}


Här är hur du kallar på valideringsfunktionen från en save knapp

var Fields = new Array("Subject","Choice","Check","Body","List")
var Msg = new Array("The Subject","The Choice","Check","Body","List"); 
if(valid(Fields,Msg)){
document.forms[0].submit()}



Relevanta Poster på Notessidan:



Publicerad 2008-03-10 | Kommentarer: 3 | Läsningar: 2516
Kommentarer

Johan Känngård ( 2008-03-11 00:05:57 ) Websida
Smartare är att sätta en klass på HTML-elementet, typ "required", och loopa igenom alla fält och kolla efter den klassen. Om man dessutom använder fieldsets i HTML, är det enkelt att ta fram "titeln" för ett fält. Här är två exempel på hur man kan göra:
http://www.webcredible.co.uk/user-friendly-resources/dom-scripting/validate-forms-javascript.shtml
http://www.onlinetools.org/articles/unobtrusivejavascript/chapter5.html
Thomas ( 2008-03-11 07:58:45 ) Websida
Hej Johan
Tack för länken, jag måste testa detta. jag tycker det är svårt att hitta bra exempel på webben, ofta är alla exempel inkapslade i massa annan kod, men denna verkar lätt att förstå och implementera.

- Thomas



Erik Waldener ( 2008-09-24 10:17:37 )
Jag har testat att validera med denna kod och det funkar fint med Text och andra fält, men problem med checkbox och radio buttons. När jag kör scripter får jag fel på följande rad:
switch (eval ( 'frm.'+Fields[i]+'[0].type' )




Sök på Notessidan
Thomas Adrian
ThomasCertifierad utvecklare och administratör inom Notes & Domino

Kontakta mig







Senaste Sökningarna på Notessidan
Tor - databaser (R:59)
Tor - meta (R:3)
Tor - kizz and låtar (R:0)
Tor - Notes and error: and Someone and else and deleted and this and index and while and you and were and updating and it (R:0)
Tor - mail.sll.se (R:0)
Tor - dir (R:3)
Tor - björn and ajax (R:0)
Tor - personlig and bild and mail (R:1)
Tor - lotto (R:4)
Tor - RSS and Domino (R:18)
Tor - blacklist (R:1)
Tor - post and blank (R:0)
Tor - create (R:15)
Tor - Ärendehantering (R:1)
Tor - internet and certifikat (R:1)




Databasstatistik Blogg
Uppdateras var 15:e Minut

Antal Poster:506
Antal Kommentarer: 880
Alla sidvisningar idag:
Unika Besökare idag:
Databasstorlek: 1876,25Mb
Fixup: 2010-06-23 09:06:13
FT:2010-07-29 15:03:31
DB Procent använd: 61,4
Antal Agenter: 42
Antal Formulär: 65
Antal Vyer: 57
Antal Dokument: 3133
Antal Image Resources: 105
Antal Subformulär: 18
Antal Scriptbibliotek: 11
Totalt Antal Designelement: 490
Antal Attachments: 153
Antal Konflikter: 2
Server version 1: 368
Server version 2: Release 8.5.1FP1|January 05, 2010
Server Plattform: Windows/32
Ändrad: 2010-07-29 15:57:26
Server Tidszon: Z=-1$DO=1$DL=3 -1 1 10 -1 1$ZX=95$ZN=W. Europe
Region: sv
Kommentarsspam Idag: 0
Kommentarsspam Totalt: 3253


BlogRankers.com

Top Sites at iWEBTOOL.com

Fight Spam! Click Here!

Bloggtoppen.se

Listed on BlogShares

Increase website traffic

Top Internet Blogs

Site Checker