8

I'm using jQuery and I have a group of radio buttons all with the same name, but different value properties.

For example:

<input type = "radio" name = "thename" value="1"></input>
<input type = "radio" name = "thename" value="2"></input>
<input type = "radio" name = "thename" value="3"></input>

I want to make it so they are all unselected. Current state of my page has one of them clicked. How do I do this?

informatik01
  • 15,636
  • 10
  • 72
  • 102
Carl
  • 135
  • 1
  • 1
  • 7

10 Answers10

9

As of jQuery 1.6, $("radio").prop("checked", false); is the suggested method.

Dave Kiss
  • 10,009
  • 11
  • 51
  • 75
  • 1
    sorry, this doesn't work for me. I tried it. Also, what if I had other radio elements on the page and I didn't want to apply that behavior to them? – Carl Aug 12 '11 at 18:32
  • 3
    just try changing the selector. something like `$("input[name='thename']")` – Dave Kiss Aug 12 '11 at 19:18
  • I agree this just plain doesn't work, my (hidden) radio button doesn't get unselected (the chosen result is still passed in the form) – user1111929 Apr 10 '22 at 01:45
8
$("input:radio[name='thename']").each(function(i) {
       this.checked = false;
});

not sure why the jquery prop doesn't work and this does...

Bogdan M
  • 91
  • 1
  • 6
5

Try using this: $('input[type="radio"]').prop('checked', false);

Using jQuery's prop method can change properties of elements (checked, selected, ect.).

Kyle
  • 4,321
  • 19
  • 30
  • This worked whe I added one more single quote after the close bracket --- $('input[type="radio"]').prop('checked', false); – Jim Evans Dec 04 '13 at 18:58
  • @JimEvans Thank you. I'm not sure why I haven't seen that until now. I have edited the answer to have the closing quote. – Kyle Dec 04 '13 at 20:34
3

This is simple and works for me.

Try this one:

$('input:radio[name="gender"]').attr('checked',false);

Try this one:

$('input[name="gender"]').prop('checked', false);
tituszban
  • 3,909
  • 1
  • 18
  • 27
2

The answer posted by @matzahboy worked perfectly.

Tried other ways but this one worked the best:

$(input[name=thename]).removeAttr('checked');
Paulo Tomé
  • 1,870
  • 3
  • 18
  • 25
viniciusalvess
  • 602
  • 6
  • 17
1

This is the simple and generic answer (I believe): $("input[name=NAME_OF_YOUR_RADIO_GROUP]").prop("checked",false);

For this specific question, I would use:

$("input[name=thename]").prop("checked",false);

Hope this helps

JimmyH
  • 11
  • 1
1

it worked for me;

$('input[name="radioName"]').attr('checked', false);
Baqer Naqvi
  • 5,162
  • 2
  • 43
  • 64
1

Try the following code:

$(input[name=thename]).removeAttr('checked');
matzahboy
  • 2,966
  • 19
  • 25
  • Didn't work, but both of these did: $("input:radio[name='thename']").removeAttr('checked'); $("[name='thename']").removeAttr('checked'); The surrounding ticks are optional. – Loren Sep 11 '19 at 14:58
0
function resetRadio(name) {
    $('#form input:radio[name=' + name + ']:checked').each(function () {
        var $this = $(this);
        $this.prop("checked", false);
    });
}

$('#form input:radio').on('dblclick', function () {
    var $this = $(this);
    var name = $this.prop('name');
    resetRadio(name);
});

This allows you to double click the radios to reset them.

davidism
  • 110,080
  • 24
  • 357
  • 317
0

To unselect all the radios of a group called "namegroup", try this:

$("input[type=radio][name=namegroup]").prop("checked", false);
nonide
  • 1