-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
93 lines (84 loc) · 4 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>secureForm 2- Simple Client Side Form Validation</title>
<!-- styles -->
<link rel="stylesheet" href="css/secureForm.css" />
<link rel="stylesheet" href="css/example.css" />
<!-- html5 shiv -->
<script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6/html5shiv.min.js"></script>
<!-- jquery -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- underscore -->
<script type="text/javascript" src="js/lib/underscore.js"></script>
<!-- app -->
<script src="js/secureForm.min.js"></script>
<script>
secureForm.options({
});
</script>
</head>
<body>
<header>
<img class="logo" alt="secureFormjs logo" src="images/logo.jpg" />
<h1>simple client side form validation</h1>
</header>
<section id="introduction">
<h2>hello</h2>
<p>Secureform.Js provides out of the box front end form validation. try the form below to see it in action.For full documentation and usage:
<a href="https://github.com/johnnyfaldo/SecureForm.Js/">GITHUBLINK</a>.</p>
<a class="author" title="email me" href="mailto:[email protected]">Author: John Faldo</a>
</section>
<div class="heading">
<h3>example</h3>
<p class="note">* denotes required</p>
</div>
<main>
<aside id="sf-error-box"></aside>
<form method="post" id="secureForm" action="thanks.php">
<ul class="example-form">
<li>
<label for="name">Name*: </label>
<input type="text" name="name" data-label="Your Name" class="sf-required" />
</li>
<li>
<label for="email">Email*: </label>
<input type="text" name="email" data-label="Your Email" class="sf-required sf-email" />
</li>
<li>
<label for="phone">Phone: </label>
<input type="text" name="phone" />
</li>
<li>
<label for="username">Username*: </label>
<input type="text" name="username" data-label="Your Username:" class="sf-required" />
</li>
<li>
<label for="password1">Password*: </label>
<input type="password" name="password1" data-label="Your Password" class="sf-required sf-compare" />
</li>
<li>
<label for="password2"><small>confirm</small> Password*: </label>
<input type="password" name="password2" data-label="Password Confirmation" class="sf-required sf-compare" />
</li>
<li class="instruction">
<p>
For security purposes enter the following code into the security code box: <span id="sf-insert-captcha"> </span>:
</p>
</li>
<li>
<label for="captcha">Security Code: </label> <input type="text" name="Security Code" id="sf-captcha" class="sf-required" />
</li>
<li class="line"></li>
<li class="confirmation">
<label for="confirmation"> Confirm something: </label> <input type="checkbox" data-label="A Confirmation" name="confirm_one" class="sf-confirm" />
</li>
<li class="submit">
<input type="submit" value="Submit" />
</li>
</ul>
</form>
</main>
</body>
</html>