CODEWITHSUNDEEP
javascriptjqueryfunctionbuttonbootstrap-4
Diogo Barros
Diogo Barros

Reputation: 33

BS4: Disable Button with a button

I'm currently trying to teach myself BS4 for a project I'm developing @work. Basically what i have is a button group (of 2. The left one is active and the right one is disabled) What I want to do is to disable the left one and activate the right one and vice-versa on click. Here is the code:

<div class="btn-group">
     <button type="button" id="showscore" class="btn btn-success">Show</button>
     <button type="button" id="hidescore" class="btn btn-danger" disabled>Hide</button>
</div>

And the JS:

function lockbutton() {
    var x = document.getElementById("#showscore").button;
    if(x.click()) {
        document.getElementById("hidescore").disabled = true;
    } else{
        document.getElementById("hidescore").disabled = false; 
    }
}

Don't roast me for the JS/jQuery code. I already know it's wrong. But I can't find a way to work it around.

Upvotes: 3

Views: 767

Answers (1)

kgbph
kgbph

Reputation: 921

You might want to use the jQuery library included in bootstrap.

$(document).ready(function() {

    $('#showscore').click(function() {
        $('#hidescore').prop('disabled', false);
        $(this).prop('disabled', true);
    });

    $('#hidescore').click(function() {
        $('#showscore').prop('disabled', false);
        $(this).prop('disabled', true);
    });

});

Upvotes: 2

Related Questions