Avatar billede hav0k Nybegynder
03. januar 2006 - 15:57 Der er 9 kommentarer og
2 løsninger

JavaScript validering i IE - wtf?

Ja jeg fik aldrig rigtig svar sidst da jeg stillede dette spørgsmål (http://eksperten.dk/spm/676212), så nu prøver jeg igen:

Hvorfor virker følgende JavaScript form valideringsscript ikke i IE (det virker perfekt i Firefox)?

Det er 3 funktioner: 1) checker at alle obligatoriske felter er udfyldt, 2) validerer e-mail og 3) validerer password.

Her er koden:

<script language = "Javascript">
function ValidatePw(theForm){
    if (theForm.pw.value.length < 4) {
        alert("Password must as a minimum be 4 characters long!");
        theForm.pw.focus();
        return false;
    }
    if (theForm.pw.value != theForm.pw2.value){
        alert("Passwords doesnt match!");
        theForm.pw2.focus();
        return false;
    }
    return true;
}

/**
* DHTML email validation script. Courtesy of SmartWebby.com (http://www.smartwebby.com/dhtml/)
*/
function echeck(str) {

        var at="@"
        var dot="."
        var lat=str.indexOf(at)
        var lstr=str.length
        var ldot=str.indexOf(dot)
        if (str.indexOf(at)==-1){
          alert("Invalid E-mail")
          return false
        }

        if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
          alert("Invalid E-mail")
          return false
        }

        if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
            alert("Invalid E-mail")
            return false
        }

        if (str.indexOf(at,(lat+1))!=-1){
            alert("Invalid E-mail")
            return false
        }


        if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
            alert("Invalid E-mail")
            return false
        }

        if (str.indexOf(dot,(lat+2))==-1){
            alert("Invalid E-mail")
            return false
        }
       
        if (str.indexOf(" ")!=-1){
            alert("Invalid E-mail")
            return false
        }

        return true                   
    }

function ValidateEmail(){
    var emailID=document.userreg.email
   
    if ((emailID.value==null)||(emailID.value=="")){
        alert("Please Enter your Email!")
        emailID.focus()
        return false
    }
    if (echeck(emailID.value)==false){
        emailID.value=""
        emailID.focus()
        return false
    }
    return ValidatePw(userreg);
}

function ValidateForm(theForm) {
  if ((theForm.name_f.value != '') && (theForm.name_f.value != '') && (theForm.birth_d.value != 'Day') && (theForm.birth_m.value != 'Month') && (theForm.birth_y.value != 'Year') && (theForm.phone.value != '') && (theForm.phone.value != '+') && (theForm.country.value != '') && (theForm.country.value != '-- Country --') && (theForm.school_name.value != '') && (theForm.school_city.value != '') && (theForm.school_country.value != '') && (theForm.school_country.value != '-- Country --') && (theForm.school_phone.value != '') && (theForm.school_con.value != 'Write shortly how you are connected to the above school/institution (ex. as a teacher, student or parent).')){
      return ValidateEmail();
  }else{
      alert('You need to fill out all of the mandatory (*) fields!');
      return false   
  }
}
</script>
<form action="<?=$pagenext;?>" method="post" name="userreg" onSubmit="return ValidateForm(userreg)">

.... osv ...

</form>

Jeg er ikke så stiv i JavaScript, så er der ikke please nogen som kan hjælpe?
Avatar billede larsny Nybegynder
03. januar 2006 - 19:03 #1
prøv at skifte

onSubmit="return ValidateForm(userreg)"
med
onSubmit="return ValidateForm(this)"

det er også en god ide at afslutte linierne med ;
eks. return false;

får du ellers nogen fejl når du kører scriptet?
Avatar billede hav0k Nybegynder
03. januar 2006 - 20:50 #2
Ja så har jeg udskiftet det med:

<script language = "Javascript">
function ValidatePw(theForm){
    if (theForm.pw.value.length < 4) {
        alert("Password must as a minimum be 4 characters long!");
        theForm.pw.focus();
        return false;
    }
    if (theForm.pw.value != theForm.pw2.value){
        alert("Passwords doesnt match!");
        theForm.pw2.focus();
        return false;
    }
    return true;
}

/**
* DHTML email validation script. Courtesy of SmartWebby.com (http://www.smartwebby.com/dhtml/)
*/
function echeck(str) {

        var at="@";
        var dot=".";
        var lat=str.indexOf(at);
        var lstr=str.length;
        var ldot=str.indexOf(dot);
        if (str.indexOf(at)==-1){
          alert("Invalid E-mail");
          return false;
        }

        if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
          alert("Invalid E-mail");
          return false;
        }

        if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
            alert("Invalid E-mail");
            return false;
        }

        if (str.indexOf(at,(lat+1))!=-1){
            alert("Invalid E-mail");
            return false;
        }


        if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
            alert("Invalid E-mail");
            return false;
        }

        if (str.indexOf(dot,(lat+2))==-1){
            alert("Invalid E-mail");
            return false;
        }
       
        if (str.indexOf(" ")!=-1){
            alert("Invalid E-mail");
            return false;
        }

        return true;                   
    }

function ValidateEmail(){
    var emailID=document.userreg.email;
   
    if ((emailID.value==null)||(emailID.value=="")){
        alert("Please Enter your Email!");
        emailID.focus();
        return false;
    }
    if (echeck(emailID.value)==false){
        emailID.value=""
        emailID.focus();
        return false;
    }
    return ValidatePw(userreg);
}

function ValidateForm(theForm) {
  if ((theForm.name_f.value != '') && (theForm.name_f.value != '') && (theForm.birth_d.value != 'Day') && (theForm.birth_m.value != 'Month') && (theForm.birth_y.value != 'Year') && (theForm.phone.value != '') && (theForm.phone.value != '+') && (theForm.country.value != '') && (theForm.country.value != '-- Country --') && (theForm.school_name.value != '') && (theForm.school_city.value != '') && (theForm.school_country.value != '') && (theForm.school_country.value != '-- Country --') && (theForm.school_phone.value != '') && (theForm.school_con.value != 'Write shortly how you are connected to the above school/institution (ex. as a teacher, student or parent).')){
      return ValidateEmail();
  }else{
      alert('You need to fill out all of the mandatory (*) fields!');
      return false;   
  }
}
</script>
<form action="<?=$pagenext;?>" method="post" name="userreg" onSubmit="return ValidateForm(this)">

Men stadig samme resultat - ValidateForm() bliver stadig false i IE lige meget hvad: alert('You need to fill out all of the mandatory (*) fields!'); er det eneste jeg kan få den til. Hvorfor kan IE ikke li' scriptet?
Avatar billede roenving Novice
03. januar 2006 - 20:55 #3
Prøv at fjerne hele den lange linje een sammenligning ad gangen !-)
Avatar billede hav0k Nybegynder
04. januar 2006 - 14:19 #4
omg.. okay det prøver jeg :)
Avatar billede hav0k Nybegynder
04. januar 2006 - 23:21 #5
Ja så har jeg fundet synderen..
Det var:

(theForm.country.value != '') og
(theForm.school_country.value != '')

problemet er tror jeg fordi IE opfatter det som om mit form field country og school_country ikke eksisterer fordi det fremkaldes vha. javascript på flg måde:

<script language="javascript" type="text/javascript">
var countries = new Array();
countries[countries.length] = [<?php echo $africa;?>];
countries[countries.length] = [<?php echo $asia;?>];
countries[countries.length] = [<?php echo $australia;?>];
countries[countries.length] = [<?php echo $europe;?>];
countries[countries.length] = [<?php echo $nam;?>];
countries[countries.length] = [<?php echo $sam;?>];

function showCountries(elm,sel){
  sel = elm.form.elements[sel];
  if(elm.selectedIndex==0){
    sel.style.display = 'none';
  }else{
    sel.length = 1;
    var arrNum = elm.selectedIndex-1;
    for(i=0;countries[arrNum].length>i;i++){
      sel.options[sel.length] = new Option(countries[arrNum][i]);
      sel.style.display = 'inline';
    }
  }
}
</script>

og så form inputs:

<select name="minSelect2" id="minSelect2" onchange="showCountries(this, 'school_country');" class="box">
    <option>-- Continent --</option>
    <option>Africa</option>
    <option>Asia</option>
    <option>Australia/Oceania</option>
    <option>Europe</option>
    <option>North America</option>
    <option>South America</option>
</select>
        <select name="school_country" id="school_country" style="display:none;" onchange="" class="box">
    <option value="-- Country --">-- Country --<br>
</select>

på den måde opfatter IE åbenbart hele tiden school_country som = '' hvilket den jo ikke må. Jeg kan overhovedet ikke overskue hvordan man skal overbevise IE om dette (firefox klarer som sædvanligvis frisag:)?

Kan være at de fjolser der bruger IE selv må være uden om at undvære lige den validering?
Avatar billede roenving Novice
05. januar 2006 - 16:12 #6
Prøv at teste selectedIndex i stedet:

if(theForm.country.selectedIndex < 1)
Avatar billede hav0k Nybegynder
05. januar 2006 - 21:24 #7
hvordan teste, mener du helt præcist?
Avatar billede hav0k Nybegynder
07. januar 2006 - 00:23 #8
Well det virker åbenbart nu på begge platforme ved at jeg fjernede
(theForm.country.value != '') og
(theForm.school_country.value != '')

men åbenbart virker valideringen bare jeg har (theForm.school_country.value != '-- Country --')

men bare smid et svar, du fik mig jo ind på sandheden :)
Avatar billede roenving Novice
07. januar 2006 - 12:24 #9
Behold selv langt de fleste point !-)

-- els velbekomme '-)
Avatar billede hav0k Nybegynder
15. januar 2006 - 13:27 #10
Takker :)
Avatar billede roenving Novice
16. januar 2006 - 04:40 #11
-- og jeg takker for point ;~}
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