Validate a field, based on a user dropdown selection

Hi,

I would like the form below to validate the colour2 field, if the colour field is set to other. At present its not working. The contents of the validate2.js script is also below:

Form:

<html>

<head>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery.validate.min.js"></script>
<script type="text/javascript" src="js/validate2.js"></script>
<title>Registration Form</title>

<style type="text/css">
<!--
	label
{
		display: block;
		color: #FF0000;
		font-style: bold;
}
		-->
</style>
</head>

<body>
<form method="POST" id="registerForm" action="next_stage.php">

<select size="1" name="colour">
						<option selected value="">Select....</option>
						<option value="blue">Blue</option>
						<option value="red">Red</option>
						<option value="other">Other</option>
						</select>
					<input type="text" name="colour2" id="colour2"/>

<input type="submit" value="Submit" name="B1">
</form>
</body>

</html>

validate2.js:

$(document).ready(function(){
        $("#registerForm").validate({
        rules: {
               colour: "required",
               colour2: {
	               required: function(element) {
	              var flag = false;
	                 if($("#colour").val()=="other")
	                  {
	                    if($("#colour2").val()=="")
	                    flag = true;
	                  } 
	                  return flag;
	                     }
	                            
                       }

}
});
});

Open in new window

Any help would be greatly appreciated.

bootneck2222

Asked: 2013-12-05

1 Solution

LVL 20

chaitu chaituCommented: 2013-12-05

define id for select box

<select size="1" name="colour" id="colour">
<option selected value="">Select....</option>
<option value="blue">Blue</option>
<option value="red">Red</option>
<option value="other">Other</option>
</select>

after define the id for select box then you can call like this.
<select size="1" name="colour" id="colour">

if($("#colour").val()=="other")

Rikin ShahMicrosoft Dynamics CRM ConsultantCommented: 2013-12-05

Hi,

You have set the function to be called when the document is ready. Set it to index change event of colour and check.

bootneck2222Author Commented: 2013-12-05

Many thanks chaituu

Expand your skills with this month's free Premium course.

Validate a field, based on a user dropdown selection

Join & Write a Comment Already a member? Login.

Featured Post