Disabled submit

Eksempel:

<script type="text/JavaScript" language="JavaScript">
function minfunktion()
{
document.minform.minsubmit.disabled=true;
setTimeout("document.minform.minsubmit.disabled=false;",1000 * 5);
return true;
}
</script>

<form name="minform" onsubmit="return minfunktion()">
<input type="text" name="noget">
<input type="submit" name="minsubmit" value="Send">
</form>


Men hvorfor vil enable submit-knappen igen efter 5 sekunder? Er det fordi serveren måske ikke når at svare tilbage?

Undskyld, knappen skal disabled når der klikkes og holdes disabled i 5 sek. - for at give serveren tid til at svare inden næste submit.

Ja, så var det som jeg skrev.. :-)

Intervallet styrer du her: 1000 * 5 (det er lig 5 sekunder)
Hvis du ændrer 5 til 10, vil den vente i 10 sekunder.

- Svar

PS: Ingen grund til at undskylde.. det var bare et ganske almindeligt spørgsmål, for at se tankegangen bag ideen.. :-)

Som sådan set jo er god nok:
- ingen grund til at submitte flere gange
- det tager normalt under 5 sekunder for serveren at svare, hvilket betyder at man normalt ikke behøver submit-knappen igen
- hvis det endeligt går galt, dvs server ikke svarer, skal man have chancen for at sende requestet igen

Jeg har før oplevet, at man skal klikke på et link en ekstra gang, før der sker noget.. ellers står browseren/serveren og laver ikke noget..

:-) Men eksemblet virker ikke, knappen disables ikke

Jo, den gør.. :-)
Du kan ikke aktivere den.. hverken ved at klikke på den, eller ved at trykke enter i et felt..

Ville du måske have, at den blev skjult i stedet?
Skjult er ikke lig deaktiveret/disabled..

Den disabler ikke her (bliver grå).
Men den submitter heller ikke.

Når der klikkes skal knappen blive grå, så der ikke kan klikkes igen før der er gået de 5 sek.
Ved ikke om jeg forklare det rigtigt?

<ole>

Jamen, når du submitter, skiftes siden jo ud med dokumentet i formens action-attribut. JavaScript fungerer på dokument-niveau og vil derfor ikke virke i denne forbindelse  =)

/mvh
</bole>

Nej, jeg submitter i target Iframe, så submitknappen bliver samme sted.

Det her vil loade filen "test.htm" i iframen, når man submitter.. og Send-knappen bliver grå, og kan ikke klikkes/aktiveres før der er gået 5 sekunder.

Det er testet og virker i: Opera v9.10, Mozilla FireFox v2.0.0.2, Microsoft Internet Explorer v6 SP2

<script type="text/JavaScript" language="JavaScript">
function minfunktion()
{
document.minform.minsubmit.disabled=true;
setTimeout("document.minform.minsubmit.disabled=false;",1000 * 5);
return true;
}
</script>

<form name="minform" onsubmit="return minfunktion()" action="test.htm" target="destination">
<input type="text" name="noget">
<input type="submit" name="minsubmit" value="Send">
</form>

<iframe src="startside.htm" id="destination" name="destination" width="100" height="100"></iframe>


Hvis det ikke virker hos dig, er der sikkert noget galt med noget andet JavaScript..
Så smid lige al koden fra filen, der indeholder min kode..

Jo det virker perfekt :-)

Tak for hjælpen.

Ups. det disabler bare ikke feltet, man kan stadig trykke enter

"Nej, jeg submitter i target Iframe, så submitknappen bliver samme sted." >> nårhhh ... jamen, jeg troede, du havde skrevet en kode, vi kunne forholde os realistisk til. Ellers er det jo svært at hjælpe  =)

Egentligt er det vel ikke så svært at lave..

Man checker for et timestamp lavet med new Date(), når der submittes..
Hvis forskellen på det sidste timestamp og det nye, er 5 sekunder (eller derover) tillades submit, og kontrol-timestamp'et sættes til det nye timestamp..

Pseudo-kode:

subtime = null; // global variabel

function MinFunk()
{
nytime = new Date();
hvis nytime - subtime >= 5 sekunder
{
submit_ok_aktiver_submit_event_ting :-)
subtime = nytime
return true;
} ellers {
der er ikke gået 5 sekunder endnu, så submit skal ignoreres
}
return false;
}

<form ... onsubmit="return MinFunk()"...>

Eller noget i den stil.. jeg kigger på det engang i aften, hvis der ikke er andre der giver eksempel inden da..

PS: Man skal også lige checke om subtime er lig null osv..

Det kan sikkert gøres på en bedre måde, men her er et fungerende eksempel:

<script type="text/JavaScript" language="JavaScript">
submittid = null;
antalsekunder = 5;

function minfunktion(f)
{
    nytid = new Date();
    if (submittid == null)
    {
        submittid = nytid;
        slaafra(f.minsubmit);
        return true;
    } else {
        if (nytid - submittid < antalsekunder * 1000) return false;
        submittid = nytid;
        slaafra(f.minsubmit);
        return true;
    }
}

function slaafra(knap)
{
knap.disabled=true;
nedtaelling();
}

function nedtaelling()
{
setTimeout("document.minform.minsubmit.disabled=false;", 5000);
}
</script>

<form name="minform" onsubmit="return minfunktion(this)" action="test.htm" target="destination">
<input type="text" name="noget">
<input type="submit" name="minsubmit" value="Send">
</form>

<iframe src="startside.htm" id="destination" name="destination" width="100" height="100"></iframe>


Det er testet og virker i: Opera v9.10, Mozilla FireFox v2.0.0.2, Microsoft Internet Explorer v6 SP2

Det virker bare perfekt.
Er det også muligt at sætte denne kode ind, som bruges nu ved submit for at sætte target og clear formularfelt?

<script language="JavaScript">
<!--

function ClearMessageField() {
document.chatform.besked.value = "";
}

function SetFormTarget() {
if (document.messageFrm.messageto.value == "public") {
  document.messageFrm.target = "publicmessages";
  }else{
  document.messageFrm.target = "privatmessages";
  }
}

// -->
</script>

Ups. nej det er denne clean jeg bruger ved submit:
onsubmit="java script:setTimeout('ClearMessageField()',100);"

onsubmit og alle de andre on-et-eller-andet (f.eks. onclick osv), er JavaScript events, og du behøver derfor ikke skrive "java script:".

Hmmm.. hvis du bruger onsubmit på den måde, hvornår kalder du så min funktion?

Det er jo heller ikke nødvendigt, men på en eller anden måde skal formularfeltet jo tømmes, da jeg submitter i target iframe.?

Du kan bare sætte din ClearMessage-timeout i funktionen "nedtaelling"..

Funktionen "minfunktion" kalder jo funktionen "slaafra" som kalder "nedtaelling".. så den vil blive kaldt..

Du kan evt eksperimentere med intervallet.. dvs, måske 250 ms i stedet for 100..
Det er helt op til dig..

Jeg har prøvet, men det generer scriptfejl, prøver igen...

Husk at rette navnene på formen og felterne.

Det får jeg ikke til at virke, burde det ikke være sådan her?

<script type="text/JavaScript" language="JavaScript">
submittid = null;
antalsekunder = 5;

function submitfunktion(f)
{
    nytid = new Date();
    if (submittid == null)
    {
        submittid = nytid;
        slaafra(f.knap);
        return true;
    } else {
        if (nytid - submittid < antalsekunder * 200) return false;
        submittid = nytid;
        slaafra(f.knap);
        return true;
    }
}

function slaafra(knap)
{
knap.disabled=true;
nedtaelling();
}

function nedtaelling()
{
setTimeout("document.chatform.knap.disabled=false;", 200);
setTimeout("document.chatform.besked.value = "";", 200);
}

</script>

<form name="chatform" onsubmit="return submitfunktion(this)" action="test.htm" target="destination">

Ahh.. du bruger jo "" begge steder..

Du skal bruge både 2x " og 2x ':

setTimeout("document.chatform.besked.value = '';", 200);

Du kunne også bruge \" i stedet for ".

JA. Så virker det. :-)