Search code examples
javascriptjqueryonclicktogglebuttondisabled-input

Button enable and disable on click


So I have this link to press

<a href="link" target="_blank">
    <div class="well">
        <span> blabla </span>
    </div>
</a>

and this button code in a page

<button  type="submit" class="btn-primary btn-lg" disabled="disabled"> Blabla </button>

And as you can see the button is disabled for now. How can I make that when I press that link the button to be enabled again? sorry for my bad English..


Solution

  • Try this generalized function for toggleDisabled

    //Generalized function to make element toggleDisabled.
    (function($) {
        $.fn.toggleDisabled = function(){
            return this.each(function(){
                this.disabled = !this.disabled;
            });
        };
    })(jQuery);
    //Code to use toggleDisabled
    $(document).ready(function(){
      $("a").click(function(){
          $("button[type='submit']").toggleDisabled();
      });
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <a href="link" target="_blank">
        <div class="well">
            <span> blabla </span>
        <div>
    </a> 
    <br/>      
    <button  type="submit" class="btn-primary btn-lg" disabled="disabled"> Blabla </button>