XPages: radioButtonGroup behaviour

HCL Domino Domino Forum
1

For radioButtons ( & checkBoxes too I presume ), in IE it seems you have to code your actions in both the onClick & onChange events since IE seems to ignore the onChange event. First off, are those the correct events to use?

Secondly, I find that in both Firefox & IE, that the change in radioButton state isn’t recognized (and event code not triggered) if you just click on the value (text) of the radioButton. You have to click on the text twice to activate the event code. OR, you have to carefully click only on the radioButton itself. Is this correct behaviour? Any workarounds for this (eg. using pure dijit.form.radioButton)?

2

Subject: I saw that too

I am not sure of the best way to handle, but, I created two radio groups, one for onchange for all browsers but IE, and one for IE with the onclick event. I hid the appropriate radio button. It seemed like having both events caused issues.

I also noticed the IE behavior in terms of where you have to click. I just figure IE users will have to put up with that.

Howard

3

Subject: Thanks Howard, your reply sparked me to do a little more testing

I rigged up a little test with some radioButtonGroups and came up with the following results:

Internet Explorer 8

Firefox 3.6

Client-side JavaScript - Clicking on actual radio button

onclick event of selected option executes

RESULT: new selection takes effect

onclick & onchange events of selected option executes

RESULT: new selection takes effect

Client-side JavaScript - Clicking on radio button text

onclick event of previous selection executes

onclick event of new selection executes

RESULT: new selection takes effect

onclick event of previous selection executes

onclick & onchange events of new selection executes

RESULT: new selection takes effect

Server-side JavaScript - Clicking on actual radio button

onclick event of selected option executes

RESULT: new selection takes effect

onclick event of selected option executes

RESULT: new selection takes effect

Server-side JavaScript - Clicking on radio button text

onclick event of previous selection executes

RESULT: old selection remains selected

onclick event of previous selection executes

RESULT: old selection remains selected

CONCLUSION: Use the onclick event & instruct user to click on the actual radio button (don’t know how well that will go over!). This is particularly true if you’ve got partial refreshes hinging on changed radio button values.