Skip to content

Commit 986b59a

Browse files
author
shankarThiyagaraajan
committed
- V.2.0 Final setups.
1 parent f8dd7c2 commit 986b59a

File tree

9 files changed

+899
-3159
lines changed

9 files changed

+899
-3159
lines changed

‎src/demo/index.html‎

Lines changed: 104 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,86 +1,129 @@
1-
<!Doctype html>
2-
<html>
1+
<!DOCTYPE html>
2+
<html lang="en">
33
<head>
44
<meta charset="UTF-8">
5-
<meta name="viewport" content="width=device-width,initial-scale=0.9">
6-
<title>Demo 1 | Javascript Validator</title>
5+
<title>Demo 2 | Javascript Validator</title>
76
</head>
87
<body>
9-
<div>
10-
<form name="demo_validation" id="demoValidation" novalidate>
11-
<div>
12-
<div>
13-
<div id="test"></div>
14-
<label for="name">Name :</label>
15-
<input type="text" data-allow="onlyAlpha" pattern="^[a-zA-C]+$" id="check" data-allowSpecial="_."
16-
value=""
17-
name="name"
18-
required>
8+
9+
<div class="col-md-8" align="center" style="margin-left: 20%">
10+
<div class="title"><h2>Input Client Information</h2></div>
11+
<form method="POST" id="clientAdd" novalidate>
12+
13+
<div class="">
14+
<div class="row">
15+
<label for="name" style="align-items: baseline">Name</label>
16+
<input type="text" required class="form-control" data-allowSpecial="_" data-allow="onlyAlpha" id="name"
17+
name="name" placeholder="Enter Name">
1918
</div>
20-
<div>
21-
<label for="name1">String :</label>
22-
<input type="text" data-allow="string" value="" name="name1" required>
19+
20+
<br><br><br><br><br><br><br>
21+
22+
<div class="row">
23+
<label for="name">Address1</label>
24+
<input type="text" required class="form-control" pattern="[a-z]" id="l_address" name="l_address"
25+
placeholder="Enter address1">
26+
2327
</div>
24-
<div>
25-
<label for="name2">String + [0-5]:</label>
26-
<input type="text" data-allow="string" pattern="^[a-zA-Z0-5]+$" value="" name="name2" required>
28+
29+
<br><br><br><br><br><br><br>
30+
31+
<div class="row">
32+
<label for="name">Address2</label>
33+
<input type="text" required class="form-control" id="p_address" name="p_address"
34+
placeholder="Enter Address2">
2735
</div>
28-
<div>
29-
<label for="name3">Number in [3-500] :</label>
30-
<input type="number" name="name3" id="number" min="3" max="500" required>
36+
37+
<br><br><br><br><br><br><br><br>
38+
39+
<div class="row">
40+
<label for="name">Contact Person</label>
41+
<input type="text" required class="form-control" id="contact_person" name="contact_person"
42+
placeholder="Enter Contact Person">
3143
</div>
32-
<div>
33-
<label for="name4">Password :</label>
34-
<input type="password" data-check="rePassword" id="password" pattern="^[a-zA-Z0-5]+$"
35-
data-allow="password"
36-
value=""
37-
name="name4"
38-
required>
44+
45+
<br><br><br><br><br><br><br><br><br>
46+
47+
<label for="name">Phone No 1</label>
48+
<input type="text" required class="form-control" id="contact_no1" name="contact_no1"
49+
placeholder="Enter Phone No">
50+
51+
<div class="row">
52+
<label for="name">Phone No 2 </label>
53+
<input type="text" class="form-control" pattern="[0-9.]" id="contact_no2" name="contact_no2"
54+
placeholder="Enter Phone No">
3955
</div>
40-
<div>
41-
<label for="name5">Re-Password :</label>
42-
<input type="password" name="name5" data-parent="password" id="rePassword" pattern="^[a-zA-Z0-5]+$"
43-
data-allow="password"
44-
required>
56+
57+
<br><br><br><br><br><br><br>
58+
59+
<label for="name">Email Address 1</label>
60+
<input type="email" required class="form-control" id="email1" name="email1" placeholder="Enter Email">
61+
<div class="row">
62+
<label for="name">Email Address 2</label>
63+
<input type="text" class="form-control" id="email2" name="email2" placeholder="Enter Email">
4564
</div>
46-
<div>
47-
<select required name="select1">
48-
<option value=""></option>
49-
<option value="123">123</option>
50-
</select>
65+
66+
<br><br><br><br><br><br><br><br><br><br><br><br><br>
67+
68+
<label for="name">Designation</label>
69+
<input type="text" required class="form-control" id="designation" name="designation"
70+
placeholder="Enter Designation">
71+
<div class="row">
72+
<label for="name">Department</label>
73+
<input type="text" required class="form-control" id="department" name="department"
74+
placeholder="Enter Department">
5175
</div>
76+
<br><br><br><br><br><br><br><br><br><br><br><br><br>
5277
<div>
53-
<select required name="select2">
54-
<option value=""></option>
55-
<option value="456">456</option>
56-
</select>
78+
<label>Password</label>
79+
<input type="password" name="name5" data-check="repassword" id="password" required>
5780
</div>
5881
<div>
59-
<textarea required name="text1"></textarea>
82+
<label>Re-Password</label>
83+
<input type="password" name="name6" data-parent="password" id="repassword" required>
6084
</div>
85+
86+
<br><br><br><br><br><br><br><br><br><br><br><br><br>
87+
88+
<label for="file">File</label>
89+
<input type="file" required class="form-control" id="file" data-extensions="png,jpeg,jpg" name="file">
90+
91+
<br><br><br><br><br><br><br><br><br><br>
92+
</div>
93+
<div>
94+
<label>Min :</label>
95+
<input type="number" required min="2" max="10" minlength="1" maxlength="2" name="rangeTester">
6196
</div>
62-
<input type="submit" value="Save">
97+
<br><br><br><br><br><br><br>
98+
<div>
99+
<label>Length Chars :</label>
100+
<input type="text" required min="4" max="50" data-maxlength="10" name="rangeTester">
101+
</div>
102+
<br><br><br><br><br><br><br>
103+
<button type="submit" name="btn-save" class="btn btn-default">Submit</button>
63104
</form>
64105
</div>
106+
<script src="./../js/formValidator.js"></script>
65107

66-
<!--<script src="./../js/formValidator.min.js"></script>-->
67-
<!--<script src="./../js/formValidator.js"></script>-->
68-
<script src="../js/formValidator.es6.js"></script>
69108
<script>
70109

71-
(function () {
72-
73-
// var val = jsValidator.init({
74-
// form: 'demoValidation',
75-
// onlyFilter: false
76-
// });
77-
78-
var val = new jsValidator().init({
79-
form: 'demoValidation',
80-
onlyFilter: false
81-
});
110+
var form = new jsValidator();
111+
form.init({
112+
form: 'clientAdd',
113+
forceFilter: true,
114+
onChange: true,
115+
errorClass: '__error_cap',
116+
log: true,
117+
message: {
118+
required: 'This field is required.',
119+
min: 'This field length is too low.',
120+
max: 'This field length is exceeds the limit.',
121+
password: 'Password does not match.',
122+
email: 'Email is not valid.',
123+
file: 'This file is not allowed.'
124+
}
125+
});
82126

83-
}());
84127
</script>
85128
</body>
86129
</html>

‎src/demo/index2.html‎

Lines changed: 0 additions & 114 deletions
This file was deleted.

0 commit comments

Comments
 (0)