Validation on toggling radio buttons

[jnag]

Hi,

I have 2 grids - grid 1 and grid 2, each with some Yes/No radio
buttons. The 2 grids can be toggled on the form based on another
selection.

My problem is....I have some validation on the radio buttons when
the "yes" radio button is checked. Suppose, the user is looking
at grid 1 on the form and picks the "yes" radio button, then,
changes his/her mind and picks grid 2, the browser page still
remembers that the radio button "yes" of grid 1 was selected,
and hence tries to access the validation routine and pops up
an error message (since focus is lost on the original radio button).

How do I solve this problem?

Thanks in advance for any help....

jnag

 

[Ian Hobson]

Hi,

I have 2 grids - grid 1 and grid 2, each with some Yes/No radio
buttons. The 2 grids can be toggled on the form based on another
selection.

My problem is....I have some validation on the radio buttons when
the "yes" radio button is checked. Suppose, the user is looking
at grid 1 on the form and picks the "yes" radio button, then,
changes his/her mind and picks grid 2, the browser page still
remembers that the radio button "yes" of grid 1 was selected,
and hence tries to access the validation routine and pops up
an error message (since focus is lost on the original radio button).

How do I solve this problem?

Hi jnag,

I am not clear what your problem actually is. I suspect that you have a
validation routine on the "onblur" or "onchange" event of a radio or
checkbox set called grid 1. You have the intent of validating and poping
up an error message, and setting the focus BACK to the check box. The
validation is called, the popup appears, but the focus is not changed!

At least that is my guess.

The reason is that the validation is performed before the new field is
selected. Thus the user's click on grid 2 will get actioned after you
set focus to grid 1.

A fix that I have used is to set a short timeout in the validation
routine, to call a function that sets the focus where it is needed.

E.g. to set the focus to field "quantity" in form "myform" you write.

function setfocus() {
var frm = document.getElementById('myform');
frm.quantity.focus();
}

and the validation routine calls the following if it wishes to move the
focus.

setTimeout(setFocus,100);

This works in FF and IE6 - it should be fairly widely supported.

I have never set focus to a radio button, so you might have to fiddle
with the exact code.

Don't forget to repeat the validation on the server: both to protect
your site and to ensure that your page works for users without
JavaScript or where their version of JavaScript can't handle your code

Regards

Ian