I always forget the correct way to get the currently selected value of a radio button group. I'm documenting it here so I can hopefully finally remember it!
Suppose the following markup:
"Today" will be selected by default when the page loads. If you use the following jQuery, you will get "today".
But, you will still get "today" even if the user clicks on the yesterday radio box. That's because the "checked=checked" will not change, only the internal DOM property will be updated. So, this is the correct way to get the radio button value, which will handle default cases and after a user selects a different value:
Suppose the following markup:
<input name="date" type="radio" value="today" checked="checked" /> Today <br />
<input name="date" type="radio" value="yesterday" /> Yesterday
"Today" will be selected by default when the page loads. If you use the following jQuery, you will get "today".
// DON'T USE THIS ONE!!
alert( jQuery( 'input[name=date][checked=checked]' ).val() );
But, you will still get "today" even if the user clicks on the yesterday radio box. That's because the "checked=checked" will not change, only the internal DOM property will be updated. So, this is the correct way to get the radio button value, which will handle default cases and after a user selects a different value:
alert( jQuery( 'input[name=date]:checked' ).val() );