Custom radio buttons not triggering a lost focus on click

[mollycm]

Hi there,
I followed this post to help me create custom radio buttons (since I didn’t think I could customize Axure’s radio buttons to this degree: Is it possible to create a dynamic custom radio button in axure?

However, after typing into the text field above clicking straight on a radio button below is not triggering the text field above to lose focus. The only way to get it to lose focus is via the tab key or clicking directly into a different text box.

I’ve tried focusing on the radio button upon click as well as placing an invisible text field behind the radio button which doesn’t work. If I place the invisible text box on top I can’t activate the radio button.

Thanks in advance!

02_custom radio buttons not triggering a lost focus on click.rp (611.7 KB)

[josephxbrick]

Hi!

This is definitely a bug, as Axure 8 does not behave this way and Axure 9 behaves this way only when the “page dimensions” is set to a mobile style.

Here’s a workaround.

• In the Click event for the radio button, set focus to the radio button after selecting it. (You mentioned you tried this, but there was Set Focus code in one of your buttons whose target had not yet been chosen. Be sure to set focus to “this widget.”)
• To avoid the blue rectangle that appears around your radio button when it gets focus, be sure to assign the radio button a focus “style effect,” which you can do through right-click. (I simply set its opacity to 100 for the focus style event, which was already its opacity, so there was no visual change but more importantly there was no blue rectangle…)

[mollycm]

Thanks for your response.

This is what I tried. It’s still not working. Any chance you can take a look at the file?

Here’s the file:
02_custom radio buttons not triggering a lost focus on click.rp (611.7 KB)

[josephxbrick]

I don’t use Axure at work anymore, but I’ll take a look when I get home.

[josephxbrick]

Hi!

I looked at it this morning and it’s working for me. The “2 years” button is the one that places focus on itself, and that one does remove focus from the field. I’m on a mac using Chrome. I don’t have a Windows machine so I can’t test it there.

Interesting tidbit: when I try it using Safari, everything works as expected on all buttons, so this seems to be a bug using Chrome only.

If you are still having problems, try this: give the button a focus style-effect that actually changes the appearance of the button when I gets focus. If the appearance of the button changes, and the field still has focus, that would be amazingly strange. [Edit: Disregard the previous comment, as the selection style supersedes the focus style.]

Good luck, and let me know how things work out!

[mollycm]

Wow, that’s so interesting. So you were able to get the loan field to validate and normalize the number to dollars and cents by clicking on 2 years in Chrome?

(still only way I can do it is by clicking into the input field).

I’m on a Mac and using Chrome as well but I did try it in Safari and it works for me there. I cleared cache and still not working in Chrome. I’ll have my colleague check on his Chrome tomorrow.

Thanks for taking a look!

UPDATE: I was able to fix by creating a new loan amount input field (that seemed to be the issue) but not sure why it wasn’t working before. 04_custom radio buttons not triggering a lost focus on click_update.rp (647.5 KB)