forked from huncent/Vanadium
-
Notifications
You must be signed in to change notification settings - Fork 0
/
test-embedded.html
115 lines (97 loc) · 2.64 KB
/
test-embedded.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<!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>