CODEWITHSUNDEEP
javascriptjquery
Raihan
Raihan

Reputation: 4001

Radio Type Toggle button issue

I have three custom buttons and they works like a radio. I wanted to add something extra in this but I am not figuring out how .

There are three buttons currently (can be more) I can select only one . If I select any one color of the button will change and will show as it is active. I am wanting if I again click on this selected button this will unselect.

It should stay as a radio type but on addition I am wanting above requirement.

HERE is my JS fiddle DEMO

JS

    $('.toggleButtonRadio').click(function(){
    $('.toggleButtonRadio').removeClass("active");
    $(this).toggleClass("active");
});

Upvotes: 1

Views: 35

Answers (1)

DarkAjax
DarkAjax

Reputation: 16223

The problem is that you remove the active class before the toggle, so it doesn't remove it, you can change your code to this:

$('.toggleButtonRadio').click(function(){
    $(this).toggleClass("active");
    $('.toggleButtonRadio').not(this).removeClass("active");
});

JSFiddle Demo

Upvotes: 4

Related Questions