Clever Geek Handbook

Disabling html button with JavaScript will not POST

I have this Javascript and HTML for my button:

function lockoutSubmit(button) {
  var oldValue = button.value;

  button.setAttribute('disabled', true);
  button.value = '...processing...';

  setTimeout(function(){
    button.value = oldValue;
    button.removeAttribute('disabled');
  }, 3000)
}
      

        
        
        
      

    
<button style="margin-right:-160px;" type="submit" name="gen" onclick="lockoutSubmit(this)" class="btn btn-danger btn-block">Generate account!</button>
Run codeHide result


This code works fine for disabling a button for 3 seconds, but the button is no longer sent to "gen".

+3


source to share


1 answer


Change innerHTML instead of value and bind parameters to the setting instead of relying on context.

Also the value of the button may not be what you think: http://www.w3schools.com/tags/att_button_value.asp



<html>
    <head>
        <script>
            function _Unlock(){
                var tB = document.getElementById('gen');
                tB.removeAttribute('disabled');
                tB.innerHTML = 'Generate account!';

                localStorage.setItem('Lock', 0);
            }

            function Unlock(){
                var tS = localStorage.getItem('Lock');

                if (tS != '1') _Unlock()
                else{
                    setTimeout(function(e, v){
                        _Unlock()
                    }, 3000)
                }
            }

            function setToLock(){
                localStorage.setItem('Lock', 1);
            }
        </script>
    </head>

    <body onload = 'Unlock()'>
        <!-- Do you have a form and is it setup correctly? -->
        <form action = '' method = 'post' id = 'myForm' onsubmit = 'setToLock()'>
            <button id = 'gen' type = 'submit' name = 'gen' disabled = 'disabled'>...processing...</button>
        <form>
    </body>
</html>
+1


source






More articles:


All Articles