Conditional validation using JavaScript

Hi all

I have a form that has some hidden sections within it that will appear based upon selection of approriate radio buttons and drop down selections. This is all working as I'd hoped but now I need to introduce some elements of validation control and I'm having a few issues that I'm hoping you may be able to help me with.

I have some code I can use for my validation routines but how do I go about running only certain elements based upon the selection made in my radio buttons?

For example: I have radio button group (new_contactmade_t = true = Yes and new_contactmade_f = false = No). If the user selects Yes then how do I go about only needing to validate certain fields. I was thinking something like a simple if else statement here. As I say I have the other validation controls already in place (although these need further testing) but the first part is to make sure only those fields that need validating at any given time are validated.

I was thinking along the lines of the attached code snippet (I know I'm calling the same within each if statement but it's to give you an idea of what I'm thinking). I need to be able to nest if statements within others (so that if a certain field has been selected within an area of the form I can ensure validation is run upon this).

Hope that all makes sense.

Thanx in advance for any suggestions as always
if (document.getElementById('new_contactmade_t') == true) {
			if (IsRequired(document.getElementById('new_dateofcontact')) == false) {isValid = false;}
			
			if (document.getElementById('new_nocontactreason') == '5') {
				if (pReq(document.getElementById('new_nocontactreason')) == false) {isValid = false;}
				if (rReq(document.getElementById('new_contactmade_t'), document.getElementById('new_contactmade_f')) == false) {isValid = false;}
			}
		}
		if (document.getElementById('new_contactmade_t') == false) {
			if (IsRequired(document.getElementById('new_dateofcontact')) == false) {isValid = false;}
			
			if (document.getElementById('new_nocontactreason') == '5') {
				if (pReq(document.getElementById('new_nocontactreason')) == false) {isValid = false;}
				if (rReq(document.getElementById('new_contactmade_t'), document.getElementById('new_contactmade_f')) == false) {isValid = false;}
			}
		}

Open in new window

LVL 2
Steven O'NeillSolutions ArchitectAsked:
Who is Participating?
 
Kim WalkerWeb Programmer/TechnicianCommented:
try using:
document.getElementById('new_contactmade_t').checked == true;

Open in new window

The state of the radio button is in the "checked" property.

Some browsers will also allow you to check the value of the group using their name which has to be the same in order for them to toggle.

document.formname.radiogroupname.value == buttonvalue;

Open in new window


For example, using the following html form:
<form name="form1" action="someaction" method="post">
<input type="radio" name="buttons" id="buttonOn" value="1" /> On
<input type="radio" name="buttons" id="buttonOff" value="2" /> Off
</form>

Open in new window


you could check which button by using the following javascript:
if (document.form1.buttons.value == '2') {
// perform validation for button off
}

Open in new window

0
 
Steven O'NeillSolutions ArchitectAuthor Commented:
Thanx for the guidance here. Has helped a great deal.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.