Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
115 lines (97 sloc) 2.64 KB
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Validation Test</title>
<script src="lib/jquery-1.3.2.js" type="text/javascript"></script>
<script src="dist/vanadium.js" type="text/javascript"></script>
<script type="text/javascript">
var VanadiumRules = {
email: [
'only_on_blur',
{validator:'required', advice:'email_advice'},
{validator:'email', advice:'email_advice'}
],
name: [
'required',
['min_length', 5],
['wait', 500],
['ajax', '/user_exists.json']
],
pass: [
'required',
['min_length', 5, 'global-advice'],
['wait', 200]
],
repeat_pass: [
['advice', 'global-advice'],
'required',
['min_length', 5, 'global-advice'],
['same_as','pass','global-advice']
],
top: 'container',
email_and_name: 'container',
passwords: 'container'
}
</script>
<style type="text/css">
* {
margin: 10px;
}
div.vanadium-invalid {
border-color: #F00 !important;
border-style: solid !important;
}
div.vanadium-valid {
border-color: #0F0 !important;
border-style: solid !important;
}
.vanadium-message-value {
font-style: italic;
text-decoration: underline;
}
.vanadium-advice.vanadium-invalid, .vanadium-advice.vanadium-invalid * {
color: #F00;
}
div {
margin: 10px;
padding: 10px;
border-color: #00F;
border-style: solid;
}
input.vanadium-valid {
background-color: greenyellow;
}
input.vanadium-invalid {
background-color: palevioletred;
}
</style>
</head>
<body>
<div id="top">
<form id="signup-form" action="" name="f" method="post">
<div id="global-advice" style="display:none"></div>
<div id="email_and_name" >
<label class="desc" for="email">email: </label>
<input id="email" type="text"
class="field text large">
<span id="email_advice"
style="display:none">Please enter a valid email address. For example fred@domain.com .</span>
<br/>
<label class="desc" for="name">name: </label>
<input id="name" type="text">
<br/>
</div>
<div id="passwords" >
<label class="desc" for="pass">password: </label>
<input name="password" id="pass" type="password">
<br/>
<label class="desc" for="repeat_pass">repeat password: </label>
<input id="repeat_pass" type="password">
<br/>
</div>
<input type="submit" value="submit"/>
</form>
</div>
</body>
</html>