Button disable/enable onclick

Question

I have 2 buttons like this :

$body .= '<a href="#" onclick="check();" id="check">Check </i></a>';
$body .= '<a  href="#" onclick="continue();" id="cont">Continue </a>';

I want that the Continue button is disable if the user don't click on the Check button.

I have this :

    $('#cont').click(function(){return false; });
$('#check').click(function() {
    $('#cont').unbind('click');
});

But when I click on the Continue button (before click on the check) The href don't work it's good but the onclick work ! How I can disable the onclick with the href. Thank you

jQuery doesn't disable the inline onclick attribute, you should be using proper event handlers that can be attached and removed with on() and off(). — adeneo, Jan 02 '14 at 10:59
I think you want something like... http://stackoverflow.com/questions/1756425/prevent-onclick-action-with-jquery — Reza Mamun, Jan 02 '14 at 11:11

Satish · Accepted Answer · 2014-01-02T11:45:35.973

1

you can use this

$body .= '<a href="#" onclick="check();" id="check">Check</a>';
$body .= '<a  href="#" onclick="continue();" id="cont" disabled>Continue </a>';

and jquery code

 $(document).ready(function(){
    $('[name^="check"]').change(function() {   
        if( $('#cont').prop('disabled'))
         $('#cont').prop('disabled',false);
        else
            $('#cont').prop('disabled',true);
    });    

});

you can use this link http://jsfiddle.net/DC3EH/101/

edited Jan 02 '14 at 11:45

answered Jan 02 '14 at 11:04

Satish

537
2
9
21

It isn't work for me ? can you give me a JSFiddle ? Thank you – user3149518 Jan 02 '14 at 11:13
i used jquery 1.8,you can directly use click ,live instead of on .go throught the docs. if you find the answer mark as answer and upvote.. you can directly paste your code in jsfiddle and test it – Satish Jan 02 '14 at 11:20
use this jsfiddle link http://jsfiddle.net/DC3EH/101/ and this is even better to u http://jsfiddle.net/DC3EH/103/, if its works mark as answer and upvote – Satish Jan 02 '14 at 11:38

score 0 · Answer 2 · answered Jan 02 '14 at 11:15

0

You can use jQuery's on and off. Check this fiddle.

answered Jan 02 '14 at 11:15

Niranjan Borawake

1,628
13
20

score 0 · Answer 3 · answered Jan 02 '14 at 11:51

Remove onclick attribute from both buttons and use below code, if works

Disable the continue button initially

$body .= '<a href="#" id="check">Check</a>';
$body .= '<a  href="#" id="cont" disabled="disabled">Continue </a>';

$('#check').click(function(e) {
   e.preventDefault();
   $('#cont').prop({disabled:false});
});

score 0 · Answer 4 · answered Jan 02 '14 at 12:19

My HTML:

<a href="#" onclick="check();" id="check">Check </i></a>
<a href="#" onclick="continueX();" id="cont">Continue </a>

My JS:

function check(){
    //console.log('Check >>>');
    //Whatever you run...
}

function continueX(){
    //console.log('continue >>>');
    //Whatever you run...
}

$('#cont').each(function(){
    //block clicking:
    $(this).click(function(e){e.preventDefault(); return false});

    //Store its current inline onclick property;
    $(this).data('onclick', this.onclick);

    //add a class to identify itself:
    $(this).addClass('disabled');

    //Re-define it:
    this.onclick = function(event) {
        //Restrict click if it has disabled class:
        if( $(this).hasClass('disabled') ){
            return false;
        };

        //otherwise, call inline onclick:
        $(this).data('onclick').call(this, event || window.event);
    };
});

$('#check').click(function(){
    //now allow click:
    $('#cont').unbind('click').removeClass('disabled');
});

Button disable/enable onclick

4 Answers4