icheck icon indicating copy to clipboard operation
icheck copied to clipboard

Radio is checked on focus in iCheck v2.0

Open brandoski opened this issue 8 years ago • 6 comments

This apparently is a resolved issue in v1 but not in v2.0. Reference: Issue #168

When tabbing to a radio button, the focused radio button gets selected for no apparent reason.

From a user perspective, this behavior is a bit confusing, because jumping from a textbox to a radio button marks the latter as selected.

Does anyone have solution for this in v2.0?

brandoski avatar Apr 01 '16 18:04 brandoski

+1

JayAdra avatar Apr 12 '16 01:04 JayAdra

+1

ghost avatar Apr 21 '16 11:04 ghost

+1

neskhodovskiy avatar May 04 '16 14:05 neskhodovskiy

+1

shainanigans avatar Jun 07 '16 02:06 shainanigans

+1

Disclaimer: It's quite late here, 00h50, so whether this fix has any major implications down the line, I'll probably only find out on Monday when I work with this project again.

From what I can tell, line 946: if (self.type == 'checkbox' && event.keyCode == 32 && settings.keydown || self.type == 'radio' && !self.checked) { has a logic error. In that || self.type == 'radio' is going to cause that toggle operator function to fire no matter what whenever the element is a type 'radio'. It would also happen when any keyup event occurs actually, not just tab. It's just a little difficult to trigger any other keyup on the radio element though. ;)

The fix for me was to change that line to this rather: if ((self.type == 'checkbox' || self.type == 'radio') && event.keyCode == 32 && settings.keydown && !self.checked) {

This prevents the radio button being selected during tab movements, but keeps the ability to use space and the regular arrow keys to trigger a select of the radio element.

bkrypt avatar Jul 29 '16 22:07 bkrypt

I'm looking to extend this to allow arrow keys to traverse the radios without selecting them, any ideas on how this could be done @keith1024?

NewJenk avatar Oct 14 '18 13:10 NewJenk