[Javascript] Button disablen werkt niet in IE

[Rowdy.nl]

Ik had een hele tijd problemen met het submitten van een form in Internet Explorer (Opera/FF etc werkte wel). De code die ik normaal gebruikte, werkte gewoon niet.

Echter ik had nu het verschil dat ik de button waar op geklikt werd deed disabelen en van tekst liet veranderen via onderstaande code.

JavaScript:

<script type="text/javascript">
    function submitForm()
    {
        document.getElementById('btnSubmit').value = 'Momentje...';
        document.getElementById('btnSubmit').disabled = true;   
        document.getElementById('frmRegister').submit();    
    }
</script>

Ik had een hoop geprobeerd, zoals

JavaScript:

document.getElementById('frmRegister').submit();
document.getElementById('frmRegister').submit; // Zonder () dus
document.frmRegister.submit();
document.frmRegister.submit;
//etc etc

In eerste instantie had ik de id's met underscores ipv aan elkaar met hoofdletters, dat op een gegeven moment veranderd, want misschien dat het daar aan lag. Het vreemde was dat als ik de () bij de submit liet staan IE me deze melding gaf: "Deze eigenschap of methode wordt niet ondersteund door dit object". Indien ik de () weg liet deed ie gewoon niets. De button werdt netjes gedisabled en de tekst veranderde, maar verder niets. Ik heb een gegeven moment ook geprobeerd om this.form als attribuut mee te geven aan mijn functie, en dan een .submit op dat object te doen, maar dat gaf dezelfde meldingen

Nu blijkt, dat als ik die button.disabled weghaal (regel 5) hij het wel gewoon doet in IE. Het probleem echter is, dat ik nu dus niet de button gedisabled heb, en de gebruiker nogmaals op de knop kan drukken.


Iemand een oplossing voor dit probleem? Of kan me een schop geven wat ik fout doe?

[Rowanov]

Enable de button als laatste actie voordat je je form de meuk laat submitten?

[Snake]

document.forms.[id van form].[id van input]

[Rowdy.nl]

Rowanov schreef op donderdag 14 september 2006 @ 23:11:
Enable de button als laatste actie voordat je je form de meuk laat submitten?

JavaScript:

<script type="text/javascript">
    function submitForm()
    {
        document.getElementById('btnsubmit').disabled = true;
        document.getElementById('btnsubmit').value = 'Momentje...';
        document.getElementById('btnsubmit').disabled = false;
        document.getElementById('frmRegister').submit();
    }
</script>

Zo? Werkt helaasch niet helemaal. Submit wel, maar de button blijft klikbaar...
Heb em er ook al na gehad, maar dan wordt ie ook niet gedisabled.

[André]

Disable hem niet maar laat hem verdwijnen met display: none

[momania]

voor zover ik weet werkt de submit via javacript idd niet...

je moet gewoon een normale submit button gebruiken en dan via de onsubmit van je form de javascript aanroepen
laat maar, submit werkt wel zie ik nu

[ Voor 12% gewijzigd door momania op 14-09-2006 23:15 ]

[André]

momania schreef op donderdag 14 september 2006 @ 23:14:
voor zover ik weet werkt de submit via javacript idd niet...

je moet gewoon een normale submit button gebruiken en dan via de onsubmit van je form de javascript aanroepen
laat maar, submit werkt wel zie ik nu

Nee dat is het niet, je kunt met javascript prima een formulier submitten

[Rowdy.nl]

Snake schreef op donderdag 14 september 2006 @ 23:13:
document.forms.[id van form].[id van input]

JavaScript:

<script type="text/javascript">
    function submitForm()
    {
        document.forms.frmRegister.btnSubmit.value = 'Momentje...';
        document.forms.frmRegister.btnSubmit.disabled = true;
        document.forms.frmRegister.submit();
    }
</script>

Zelfde problemen...

André schreef op donderdag 14 september 2006 @ 23:14:
Disable hem niet maar laat hem verdwijnen met display: none

JavaScript:

<script type="text/javascript">
    function submitForm()
    {
        document.forms.frmRegister.btnSubmit.style.display = 'none';
        document.forms.frmRegister.submit();
    }
</script>

Werkt, maar is niet echt wat ik eigenlijk wil...

Iemand een oplossing hiervoor....? Het ligt dus echt aan het disabelen van die button, dat vindt ie niet leuk...?

[ Voor 17% gewijzigd door Rowdy.nl op 14-09-2006 23:28 ]

[momania]

is de button een input type="button" ?

volgens mij is de correcte value iig voor disabled: diabled en niet true...
zie: http://www.w3schools.com/tags/tag_input.asp

[Rowdy.nl]

momania schreef op donderdag 14 september 2006 @ 23:28:
is de button een input type="button" ?

volgens mij is de correcte value iig voor disabled: diabled en niet true...
zie: http://www.w3schools.com/tags/tag_input.asp

JavaScript:

<script type="text/javascript">
    function submitForm()
    {
        document.getElementById('btnSubmit').disabled = 'disabled';     
        document.getElementById('btnSubmit').value = 'Momentje...';
        document.getElementById('frmRegister').submit();
    }
</script>

Dit werkt netjes, maar ik krijg dus weer de problemen als in de TS...

Weet iemand of ik een button gewoon niet mag disabelen?


For the record, snippet van het formulier zelf:

HTML:

<form action="/users/register" method="post" id="frmRegister" name="frmRegister">
    <input type="hidden" name="submit" value="true" />
        <table>
            <tr>
                <td style="width:150px;">Gebruikersnaam</td>
                <td><input type="text" name="usr" /></td>
            </tr>
            <tr>
                <td>Emailadres</td>
                <td><input type="text" name="email" /></td>
            </tr>
            <tr>
                <td>Wachtwoord</td>
                <td><input type="password" name="pwd1" /></td>
            </tr>
            <tr>
                <td>Wachtwoord nogmaals</td>
                <td><input type="password" name="pwd2" /></td>
            </tr>
            <tr>
                <td></td>
                <td></td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td><input type="submit" name="btnSubmit" id="btnSubmit" value="Registreren*" onclick="submitForm()" /></td>
            </tr>
        </table>
    </form>

[user109731]

Kun je ook even de html code van je form posten? En waar gaat het precies mis? staat er nog wat relevants in de firefox error console?

momania schreef op donderdag 14 september 2006 @ 23:28:
volgens mij is de correcte value iig voor disabled: diabled en niet true...
zie: http://www.w3schools.com/tags/tag_input.asp

Nee, het is een boolean volgens mij. En dus kun je gewoon true/false gebruiken

[momania]

Ik zie het al!

je hebt een input type="submit"
DIE doet de submit.. niet je javascriptje dus...

dus of de submit weglaten en je javascriptje nog een return true; toevoegen (default is geloof ik dan false en dat cancelled de submit)

of je input een type="button" maken

[edit]

vaak is het netter om de onsubmit te gebruiken van je form.
als iemand op enter drukt wordt het form ook gesubmit en dan wordt de code als het goed is overgeslagen zoals je het nu hebt.

HTML:

<form onsubmit="return submitForm()" action="/users/register" method="post" id="frmRegister" name="frmRegister">

[ Voor 49% gewijzigd door momania op 14-09-2006 23:44 ]

[Rowdy.nl]

Solved... Niet helemaal zoals ik verwacht had maarja...

iedereen iig bedankt voor de input!

Trouwens, .style.disabled = disabled; en wat ik eerst had .disabled = true; werken beide...

Ik heb nu:

HTML:

<form action="/users/register" method="post" id="frmRegister" name="frmRegister" onsubmit="submitForm()">

*knip*

<input type="submit" name="btnSubmit" id="btnSubmit" value="Registreren*" />

*knip*

</form>

*knip*

<script type="text/javascript">
    function submitForm()
    {
        document.getElementById('btnSubmit').disabled = 'disabled';     
        document.getElementById('btnSubmit').value = 'Momentje...';
    }
</script>

momania schreef op donderdag 14 september 2006 @ 23:41:
Ik zie het al!

je hebt een input type="submit"
DIE doet de submit.. niet je javascriptje dus...

dus of de submit weglaten en je javascriptje nog een return true; toevoegen (default is geloof ik dan false en dat cancelled de submit)

of je input een type="button" maken

Had ik geprobeerd, werkte ook al niet, dan wou ie helemaal niet submitten...
Damn, het wordt laat lezen wordt moeilijker... Je had wel gelijk...

[ Voor 32% gewijzigd door Rowdy.nl op 14-09-2006 23:59 ]

[user109731]

edit: is niet meer nodig, t werkt al

[ Voor 85% gewijzigd door user109731 op 14-09-2006 23:45 ]

[Rowdy.nl]

Grote prutser schreef op donderdag 14 september 2006 @ 23:44:
edit: is niet meer nodig, t werkt al

Thnx, maar werkte ook niet.... (false en true)

[Annie]

De reden dat de submit niet werkte via javascript is omdat je een hidden input hebt met de naam 'submit'. Simpelweg het element een andere naam geven (Submit / _submit / bla) was voldoende.

[Rowdy.nl]

Annie schreef op donderdag 14 september 2006 @ 23:51:
De reden dat de submit niet werkte via javascript is omdat je een hidden input hebt met de naam 'submit'. Simpelweg het element een andere naam geven (Submit / _submit / bla) was voldoende.

[vult heel vies woord in]

Je hebt helemaal gelijk, dat ik daar met mijn eigen stomme kop niet aan gedacht heb...

Thnx, nu werkt het als een zonnetje!

[crisp]

over .disabled = 'disabled' vs .disabled = true: in de DOM is de disabled-property wel degelijk een boolean.

En inderdaad: gebruik de onsubmit-handler; dan heb je ook geen JS nodig voor het daadwerkelijk submitten (maar een element een name-attribuut geven gelijk aan een standaard JS-method is nooit een goed idee )