{"action":"created","issue":{"url":"https://api.github.com/repos/erikras/redux-form/issues/2200","repository_url":"https://api.github.com/repos/erikras/redux-form","labels_url":"https://api.github.com/repos/erikras/redux-form/issues/2200/labels{/name}","comments_url":"https://api.github.com/repos/erikras/redux-form/issues/2200/comments","events_url":"https://api.github.com/repos/erikras/redux-form/issues/2200/events","html_url":"https://github.com/erikras/redux-form/issues/2200","id":192844990,"number":2200,"title":"On IE, tabbing through radio buttons has weird focus and change behavior","user":{"login":"orfjackal","id":42678,"avatar_url":"https://avatars.githubusercontent.com/u/42678?v=3","gravatar_id":"","url":"https://api.github.com/users/orfjackal","html_url":"https://github.com/orfjackal","followers_url":"https://api.github.com/users/orfjackal/followers","following_url":"https://api.github.com/users/orfjackal/following{/other_user}","gists_url":"https://api.github.com/users/orfjackal/gists{/gist_id}","starred_url":"https://api.github.com/users/orfjackal/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/orfjackal/subscriptions","organizations_url":"https://api.github.com/users/orfjackal/orgs","repos_url":"https://api.github.com/users/orfjackal/repos","events_url":"https://api.github.com/users/orfjackal/events{/privacy}","received_events_url":"https://api.github.com/users/orfjackal/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":2,"created_at":"2016-12-01T13:21:07Z","updated_at":"2016-12-02T16:21:11Z","closed_at":null,"body":"On IE11, when tabbing forward and backward through the following radio buttons, the focus and value changes happen differently from Chrome and Firefox.\r\n\r\n**Reproduction method 1:** In the following code, move with tab and shift-tab back and forth between the a, b and txt inputs. The expected behavior is that the currently selected form values stay unchanged, but on IE it often changes the selected value to the first or last item in the radio button group (e.g. B1 or B4).\r\n\r\n**Reproduction method 2:** Move within one radio button group by pressing up and down. On Chrome and Firefox it immediately both focuses and checks the new radio button. But on IE it only focuses the new radio button and keeps the old radio button checked; it checks the new radio button *after* you move focus away from it.\r\n\r\n```html\r\n<ul>\r\n  <li><label><Field component=\"input\" type=\"radio\" name=\"a\" value=\"a1\"/> A1</label></li>\r\n  <li><label><Field component=\"input\" type=\"radio\" name=\"a\" value=\"a2\"/> A2</label></li>\r\n  <li><label><Field component=\"input\" type=\"radio\" name=\"a\" value=\"a3\"/> A3</label></li>\r\n  <li><label><Field component=\"input\" type=\"radio\" name=\"a\" value=\"a4\"/> A4</label></li>\r\n</ul>\r\n<ul>\r\n  <li><label><Field component=\"input\" type=\"radio\" name=\"b\" value=\"b1\"/> B1</label></li>\r\n  <li><label><Field component=\"input\" type=\"radio\" name=\"b\" value=\"b2\"/> B2</label></li>\r\n  <li><label><Field component=\"input\" type=\"radio\" name=\"b\" value=\"b3\"/> B3</label></li>\r\n  <li><label><Field component=\"input\" type=\"radio\" name=\"b\" value=\"b4\"/> B4</label></li>\r\n</ul>\r\n<Field component=\"input\" type=\"text\" name=\"txt\"/>\r\n```\r\n\r\nPossibly related to #1438 but this is IE specific and thus likely a different issue.\r\n"},"comment":{"url":"https://api.github.com/repos/erikras/redux-form/issues/comments/264494438","html_url":"https://github.com/erikras/redux-form/issues/2200#issuecomment-264494438","issue_url":"https://api.github.com/repos/erikras/redux-form/issues/2200","id":264494438,"user":{"login":"orfjackal","id":42678,"avatar_url":"https://avatars.githubusercontent.com/u/42678?v=3","gravatar_id":"","url":"https://api.github.com/users/orfjackal","html_url":"https://github.com/orfjackal","followers_url":"https://api.github.com/users/orfjackal/followers","following_url":"https://api.github.com/users/orfjackal/following{/other_user}","gists_url":"https://api.github.com/users/orfjackal/gists{/gist_id}","starred_url":"https://api.github.com/users/orfjackal/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/orfjackal/subscriptions","organizations_url":"https://api.github.com/users/orfjackal/orgs","repos_url":"https://api.github.com/users/orfjackal/repos","events_url":"https://api.github.com/users/orfjackal/events{/privacy}","received_events_url":"https://api.github.com/users/orfjackal/received_events","type":"User","site_admin":false},"created_at":"2016-12-02T16:21:11Z","updated_at":"2016-12-02T16:21:11Z","body":"I was able to work around this issue by only adding redux-form's `input.name` and `input.onChange` to the radio button's attributes. For `onFocus` and `onBlur` I implemented my own event listeners which keep track of the focus status inside the React component's state (if you don't need to know focus, you could just leave out those listeners)."}}
{"actor":{"display_login":"orfjackal"}}