Event listener for radio button deselection in jquery/javascript

Question

This code won't work:

$(document).on('change', '#myRadioButton', function(){ // Won't work });

I want to catch whenever a radiobutton is deselected or selected, but the code above doesn't catch when it's unselected.

What's the proper way to catch radio button deselection?

in radio buttons there is no deselection operation... there in only a new selection which will deselect the previous one.. — Arun P Johny
– Arun P Johny, Commented Feb 6, 2014 at 15:18

A. Wolff · Accepted Answer · 2014-02-06 15:25:34Z

4

I guess, you should use something like that, setting onchange event on all radios from same group:

DEMO jsFiddle

$(document).on('change', ':radio[name=mygrp]', function(){ alert($('#myRadioButton').is(':checked')); });

answered Feb 6, 2014 at 15:25

A. Wolff

74.4k9 gold badges98 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Weblurk Over a year ago

Thanks. Ended up using this solution. Any idea of why the 'change' event won't fire when radio is deselected? You ARE changing it's value after all.

A. Wolff Over a year ago

Should see the specification but i think this is not what specification says, fire change event of radio button when deselected.

Amit Joki · Accepted Answer · 2014-02-06 15:36:47Z

Do this:

 $('#myRadioButton').change(function(){ alert("changed"); }); $('input[type=radio]').not('#myRadioButton').change(function(){ $('#myRadioButton').change(); });

What it does ?

We know that, a radio button only gets deselected when any other radio button gets selected.

So I basically bind a change event for #myRadioButton and then bind all other radio buttons except #myRadioButton to the change event and on it, i invoke #myRadioButton's change event. like $('#myRadioButton').change();

Here is the JsFiddle I'm damn sure, that it will work.

Mark it as answer if it helps :)

Collectives™ on Stack Overflow

Event listener for radio button deselection in jquery/javascript

2 Answers 2

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Related