jQuery check/uncheck radio button onclick
I have this code to check/uncheck a radio button onclick.
I know it is not good for the UI, but I need this.
$('#radioinstant').click(function() {
var checked = $(this).attr('checked', true);
if(checked){
$(this).attr('checked', false);
}
else{
$(this).attr('checked', true);
}
});
The above function is not working.
If I click on the button, nothing changes. It remain checked. Why? Where is the error? I am not a jQuery expert. I am on jQuery 1.3.2
Just to be clear
#radioinstant is the ID of the radio button.
Best Answer :
If all you want to do is have a checkbox that checks, don't worry about doing it with JQuery. That is default functionality of a checkbox on click. However, if you want to do additional things, you can add them with JQuery. Prior to jQuery 1.9, you can use use
$(this).attr('checked'); to get the value instead of $(this).attr('checked', true);, as the second will set the value.
Here is a fiddle demonstration that shows the default checkbox functionality vs. what you are doing with JQuery.
Note: After JQuery 1.6, you should use
$(this).prop; instead of $(this).attr in all three places (thanks @Whatevo for pointing this out and see here for further details).
UPDATE :
As Josh pointed out, the previous solution only worked with one radio button. Here's a function that makes a group of radios deselectable by their name, and a fiddle: http://jsfiddle.net/EtNXP/1467/
var makeRadiosDeselectableByName = function(name){
$('input[name=' + name + ']').click(function() {
if($(this).attr('previousValue') == 'true'){
$(this).attr('checked', false)
} else {
$('input[name=' + name + ']').attr('previousValue', false);
}
$(this).attr('previousValue', $(this).attr('checked'));
});
};
source : http://stackoverflow.com/questions/6191621/jquery-check-uncheck-radio-button-onclick
