Skip to content

Discrepancy between .active and :checked in radio button groups when going back to a page via browser history #25122

@prShadoko

Description

@prShadoko

I have noticed that when I press the "previous" button in my browser, the page is reloaded from cache and the item shown as .active is not the one I clicked last, but the one initially defined as .active in the DOM.
This might not match with the actual radio buttons state as the :checked one is the last one clicked.
Checkboxes have the same behavior in a similar setup.

I figured a way to overcome this by not using the .active class in the DOM and setting it according to the :checked states of radio buttons at page load.

See this fiddle for an example of the bug, and the temporary fix: https://jsfiddle.net/pr_shadoko/saymu7wa/7/

Tested on :
Windows 10 64bit
Chrome 63.0.3239.84 / Firefox 57.0 / Opera 49.0
jQuery 3.2.1
BS 4.0.0-beta.3
popper 1.12.9

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions