How to reset radiobuttons in jQuery so that none is checked

by

In versions of jQuery before 1.6 use:

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

In versions of jQuery after 1.6 you should use:

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

but if you are using 1.6.1+ you can use the first form (see note 2 below).

Note 1: it is important that the second argument be false and not “false” since “false” is not a falsy value. i.e.

if ("false") {
    alert("Truthy value. You will see an alert");
}

Note 2: As of jQuery 1.6.0, there are now two similar methods, .attr and .prop that do two related but slightly different things. If in this particular case, the advice provide above works if you use 1.6.1+. The above will not work with 1.6.0, if you are using 1.6.0, you should upgrade. If you want the details, keep reading.

Details: When working with straight HTML DOM elements, there are properties attached to the DOM element (checked, type, value, etc) which provide an interface to the running state of the HTML page. There is also the .getAttribute/.setAttribute interface which provides access to the HTML Attribute values as provided in the HTML. Before 1.6 jQuery blurred the distinction by providing one method, .attr, to access both types of values. jQuery 1.6+ provides two methods, .attr and .prop to get distinguish between these situations.

.prop allows you to set a property on a DOM element, while .attr allows you to set an HTML attribute value. If you are working with plain DOM and set the checked property, elem.checked, to true or false you change the running value (what the user sees) and the value returned tracks the on page state. elem.getAttribute('checked') however only returns the initial state (and returns 'checked' or undefined depending on the initial state from the HTML). In 1.6.1+ using .attr('checked', false) does both elem.removeAttribute('checked') and elem.checked = false since the change caused a lot of backwards compatibility issues and it can’t really tell if you wanted to set the HTML attribute or the DOM property. See more information in the documentation for .prop.

More Related Contents:

  1. Replace 0 in form field with empty by jQuery
  2. Prevent users from submitting a form by hitting Enter
  3. Resetting a multi-stage form with jQuery
  4. Using JQuery – preventing form from submitting
  5. jQuery: how to get which button was clicked upon form submission?
  6. Clear form fields with jQuery
  7. jQuery .val() vs .attr(“value”)
  8. Get checkbox value in jQuery
  9. How to limit the number of selected checkboxes?
  10. validating multiple textbox having same name with jquery validator validates only first input
  11. Submit form with Enter key without submit button? [duplicate]
  12. How to add additional fields to form before submit?
  13. Prevent redirect after form is submitted
  14. How to change an element’s title attribute using jQuery
  15. calculate the number of html checkbox checked using jquery
  16. Is there a way to clone form field values in jQuery or javascript?
  17. Jquery toggle event is messing with checkbox value
  18. How to make Chrome remember password for an AJAX form?
  19. Ajax Form submit with preventDefault
  20. HTML5 textarea placeholder not appearing
  21. HTML5 validation before ajax submit
  22. MS MVC form AJAXifying techniques [closed]
  23. jquery disable submit button on form submission
  24. jQuery html attribute not working in IE
  25. Force a checkbox to always submit, even when unchecked
  26. submit form does not stop in jquery ajax call
  27. submitting multiple forms with AJAX
  28. jQuery detect click on disabled submit button
  29. Weird behaviour of iframe `name` attribute set by jQuery in IE
  30. How do I select the parent form based on which submit button is clicked?

Leave a Comment