Disable submit-knappen i forbindelse med validering

Du skal have en onsubmitevent på formen, eks. onsubmit="return checkthis(this);"

dit script skal så være noget ala:

function checkthis(f)
{
  f.send.disabled=true;
 
  //Tjek alle dine felter her
  if ( alt OK ) return true;
  else return false;
}

håber du kan se princippet. Jeg har ikke rigtigt kigget så meget på din oprindelige kode, men kan se at du validerer det så snart at felter er skrevet. Der skal i hvert fald også tjekkes når onsubmit.

Nej, jeg tror ikke onsubmit virker i dette tilfælde. Så tjekkes der jo først når der trykkes på submit og fidusen er jo, at man slet ikke skal kunne trykke på submit-knappen så længe felterne ikke er valideret.

ok jeg kan godt se hvad du mener nu. Det første er selvfølgelig at sætte send knappen til disabled inden formen begynder at blive brugt, ellers kan man submitte uden at have udfyldt noget.

det gøres med at sætte dette i bunden af dit dokument

<script type="text/javascript">
document.forms[0].elements['send'].disabled = true;
</script>

Men så er det noget med javascript array, og syntes det er blandet lidt sammem, så er tror jeg må stå fra...

Har du evt. et link til den kode som Roenving har lavet, som du gik ud fra ?

<br /><input type="submit" name="send" value="Send til mig" disabled="disabled" />

roenving>> Får mig at se virker det ikke med det array - det ser ud til at først sætter man fields[0] = "postnummer" så sætter man fields[0] = false

Hvis man prøver og lave
alert(fields[0]); før og efter for-løkken vil den først være postnummer så false.

alert(fields['postnummer']); er bare undefined.

Er jeg helt galt på den eller? Jeg har i hvert fald lige kigget på scriptet, men kunne ikke få ok = true - selv om begge billeder indikerede rigtigt indtastet. :-)

Jeg sad også og gloede på koden, som jeg ikke kunne gennemskue ...

Men E* åd lige mit indlæg, så lige på:

Det skulle gøres noget anderledes (og jeg fjernede også lige et par fejlplacerede \47'ere !-)

<script type="text/javascript">
<!--

var fields = {'postnummer':false,'fornavn':false};

function jjrCheckSubmit(field)
{
    var ok = true;

    for(i in fields)
    {
        ok = ok && fields[i];
    }

    field.form.send.disabled = !ok;
}

function jjrValidate(field, regex, id, errortext)
{//alert(id)
    if (field.value.match(regex))
    {
        document.getElementById(id).src="/ok.gif";
        document.getElementById(id).title="Feltet er korrekt udfyldt!";
        fields[field.name] = true;
    }
    else
    {
        document.getElementById(id).src="/no.gif";
        document.getElementById(id).title=errortext;
        fields[field.name] = false;
    }

    jjrCheckSubmit(field);
}

//-->
</script>

<form action/formtest2.php method="get" enctype="application/x-www-form-urlencoded" >
<input type="hidden" name="jjrsubmitcheck" value="issubmittet" />
<input type="text" name="fornavn" value="Dit fornavn" maxlength="50" onfocus="jjrValidate(this, /^[a-zA-Z]{2,50}$/, 'iconid1', 'Feltet \47fornavn\47 er ikke udfyldt korrekt!')" onkeyup="jjrValidate(this, /^[a-zA-Z]{2,50}$/, 'iconid1', 'Feltet \47fornavn\47 er ikke udfyldt korrekt!')" /><img src="/no.gif" title="Feltet 'fornavn' er ikke udfyldt korrekt!" id="iconid1" />
<br /><input type="text" name="postnummer" value="Dit postnummer" maxlength="4" onfocus="jjrValidate(this, /^[1-9]\d{3}$/, 'iconid3', 'Feltet \47postnummer\47 er ikke udfyldt korrekt!')" onkeyup="jjrValidate(this, /^[1-9]\d{3}$/, 'iconid3', 'Feltet \47postnummer\47 er ikke udfyldt korrekt!')" /><img src="/no.gif" title="Feltet 'postnummer' er ikke udfyldt korrekt!" id="iconid3" />
<br /><input type="submit" name="send" value="Send til mig" disabled="disabled" />
</form>

Ja se det var meget bedre :-) Meget rart lige at få slået fast hvordan arrays virker i Javascript.

-- og man skulle jo over i et objekt for at få det til at virke, men det gør det så også !-)

Undskyld forsinkelsen, blev lige sat til at gøre hovedrent af min bedre halvdel :P

Jeg prøvet det lige af og vender tilbage :)

Så er det rette, men der er en lille fejl jeg ikke kan finde:

http://googolplex.dk/formtest2.php

Ret simpelt :-)

Du bruger:
var fields = {'postnummer':false;'fornavn':false};
det skal være:
var fields = {'postnummer':false,'fornavn':false};

altså komma der adskiller dem og ikke semikolon.

Derudover har du en enkelt fejl ved din form
<form action"/formtest2.php" method="get" enctype="application/x-www-form-urlencoded"  >
skal være
<form action="/formtest2.php" method="get" enctype="application/x-www-form-urlencoded"  >

Jamen, så tror jeg der er bingo!!

Hvis I begge smider et svar, så deler jeg pointene mellem jer :)

Det må helt være forbeholdt roenving :-)

Hov, en lille ting:

Når jeg trykker Send, så forsvinder knappen igen og kommer først tilbage når begge felter igen har fået fokus!

Kan det løses vis JavaScript eller skal det løses serverside ?

Disablingen af knappen bliver jo aktiveret ved afsendelse, så der må noget onload til, enten til at disable, når de ikke er udfyldt, eller til at enable, når de er udfyldt, men det klarer du nemmest i dit php-script, for så sætter du bare disabled ind i submit-knappen efter behov !-)

Ok, det tænkte jeg nok, sådan fungere resten også :)

Kræver bare lidt programmering, så ville lige sikre mig at der ikke var en lynhurtig måde!!

Svar roenving :)

Velbekomme '-)

Ok, men nu er der opstået et nyt problem efter jeg har ordnet det på serveren:

Når jeg trykker 'Send', så er knappen godt nok sat rigtigt, men FØRSTE gang et felt får focus så forsvinder den...

Kan det løses ?

Så skal denne linje konsekvens-rettes (til true, hvis der ikke er disabling på !-)

var fields = {'postnummer':false,'fornavn':false};

Så funker det :)

Takker for hjælpen begge!!

-- og tak for points ;~}