Multiple Radio Button Javascript validation

HCL Domino Domino Forum
1

Hi All. Here’s my quandary: I have 5 Radio buttons, all of which have the same number of choices (around 20, all dynamically read in from another document). What I need to do is to make sure that the same choice is not picked in more than one of them. i.e. If they all have A, B & C, I need to make sure that no more than one of them has A selected. I need to do this on the fly. What I want to happen is that if the user selects one that has already been selected in another RB, it simply turns the selection back off. I don’t want any error popups or similar. I know how to do it on a notes client app, I just can’t figure out how to do it on a web form.

Point: I’ve searched the forums and didn’t find anything on validating one radio button against another.

Point: I know NOTHING about javascript, but I’ve come to believe that it’s the only way to do this. If there’s another way, I’d be overjoyed to hear it.

I attempted to modify a piece of javascript I found here on the forums (included below) and put it in the OnChange event on each field (with the number modified for that field), but it does not seem to work.

Any help would be greatly appreciated.

-Keith

//********************************************************

//variable defenitions

//********************************************************

var form = document.forms[0];

rbutton1 = form.ImptF1;

rbutton2 = form.ImptF2;

rbutton3 = form.ImptF3;

rbutton4 = form.ImptF4;

rbutton5 = form.ImptF5;

var RB1 = 0;

var RB2 = 0;

var RB3 = 0;

var RB4 = 0;

var RB5 = 0;

for (i=0;i<rbutton1.length;i++) {

if(rbutton[i].checked) RB1 = i;}

for (i=0;i<rbutton2.length;i++) {

if(rbutton[i].checked) RB2 = i;}

for (i=0;i<rbutton3.length;i++) {

if(rbutton[i].checked) RB3 = i;}

for (i=0;i<rbutton4.length;i++) {

if(rbutton[i].checked) RB4 = i;}

for (i=0;i<rbutton5.length;i++) {

if(rbutton[i].checked) RB5 = i}

if (RB1 != 0) {

if (RB1 = RB2) {

rbutton[RB1].checked = False;

}

if (RB1 = RB3) {

rbutton[RB1].checked = False;

}

if (RB1 = RB4) {

rbutton[RB1].checked = False;

}

if (RB1 = RB5) {

rbutton[RB1].checked = False;

}

}

2

Subject: Multiple Radio Button Javascript validation

I hope you can take this in the spirit intended. That doesn’t sound like a very good user interface decision, if I’m reading the scenario correctly. It sounds like a “rank your top five choices in order of importance” sort of deal. If that’s the case, what happens when the user tries to change the order after making her five selections? Since users can’t clear radio buttons, she would have to select a “dummy” value for at least one of the fields before the re-ordering can begin.

A better option would be a dual-list “dialog” set-up, with all of the choices in the first listbox, a button to move selected values in the first listbox to the second, and buttons to change the order of the values in the second listbox. The actual submitted values would be in one (or five) hidden or read-only fields on the main form.

Now, this would be a lot easier if I had gotten around to publishing my ordered list dialog samples (see http://stanrogers.blogspot.com/2004/11/room-for-orderly-dialog.html ) over at OpenNTF.org, but life kinda got in the way for a while there. There are a few published examples on the web, but none that are Domino-specific AFAIK. I can probably find the code for you if you want it – it’s just a bit on the huge side to post here. Send me a self-addressed, e-stamped e-envelope if you want it – your email address is not on your profile.

3

Subject: Multiple Radio Button Javascript validation

I’m afraid that you are stuck with javascript in a web app.

You need to use the comparison operator == instead of the assignment operator =

if (RB1 = RB2) will evaluate to true if rbutton2 is checked with anything other than the first radio button option and will uncheck rbutton1.

e.g. if the second radio button option in rbutton2 is checked then RB2 will be 1 and RB1 = RB2 will evaluate to True

4

Subject: Multiple Radio Button Javascript validation

You could use input translation on the field with something like:

@If(radio1 = radio2:radio3:radio4:radio5; “” ; radio1 )

Or remove the choices from the list with this formula for choices:

@Replace( choiceListRadio1 ; radio2:radio3:radio4:radio5 ; “” )

Both of these methods require a form refresh (by setting the radio button properties to ‘refresh fields on keyword change’ and for the @Replace you need ‘refresh choices on document refresh’ also.

If you don’t want the round-trip to the server then javascript is the way to go.