jQuery: The Write Less, Do More JavaScript Library

Plugins/Validation/Methods/equalTo

From jQuery JavaScript Library

Jump to: navigation, search

« Back to Plugins/Validation/Methods

[edit]

equalTo( other )

Requires the element to be the same as another one
Returns true if the value has the same value as the element specified by the first parameter. Works with text inputs.
Arguments:
otherSelector
The selector for the element to compare the current values


Examples:

Makes "field" required to be the same as #other

$("#myform").validate({
  rules: {
    password: "required",
    password_again: {
      equalTo: "#password"
    }
  }
});


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/lib/jquery.delegate.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
<script type="text/javascript">
jQuery.validator.setDefaults({
	debug: true,
	success: "valid"
});;
</script>

  <script>
  $(document).ready(function(){
    $("#myform").validate({
  rules: {
    password: "required",
    password_again: {
      equalTo: "#password"
    }
  }
});
  });
  </script>
  <style>
  	#field, label { float: left; font-family: Arial, Helvetica, sans-serif; font-size: small; }
  	label {  width: 10em; }
	br { clear: both; }
	input { margin-left: .5em; float: left; border: 1px solid black; margin-bottom: .5em;  }
	input.submit { float: none; }
	input.error { border: 1px solid red; width: auto; }
	label.error {
		background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/unchecked.gif') no-repeat;
		padding-left: 16px;
		margin-left: .3em;
	}
	label.valid {
		background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/checked.gif') no-repeat;
		display: block;
		width: 16px;
		height: 16px;
	}
</style>
</head>
<body>
  
<form id="myform">
  <label for="password">Password</label>
  <input id="password" name="password" />
  <br/>
  <label for="password_again">Again</label>
  <input class="left" id="password_again" name="password_again" />
  <br/>
  <input class="submit" type="submit" value="Validate!" />
</form>

</body>
</html>

NameType


Retrieved from "http://docs.jquery.com/Plugins/Validation/Methods/equalTo"