Skip to content

Commit 08dac15

Browse files
victorjonssonvictorjonsson
committed
server validation trigger on blur, class names compatible with twitter bootstrap
1 parent f4f1051 commit 08dac15

13 files changed

+349
-220
lines changed

‎README.md

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -250,10 +250,7 @@ var enErrorDialogs = {
250250
groupCheckedTooFewStart : 'Please choose at least ',
251251
groupCheckedTooManyStart : 'Please choose a maximum of ',
252252
groupCheckedRangeStart : 'Please choose between ',
253-
groupCheckedEnd : ' item(s)',
254-
255-
_dummy--last-item-no-comma : 0
256-
253+
groupCheckedEnd : ' item(s)'
257254
};
258255
```
259256

@@ -297,9 +294,14 @@ it calls jQ func **$.formUtils.validateInput** to validate the single input when
297294

298295
## Changelog
299296

297+
#### 2.1.5
298+
* Fixed language bug (issue #43 on github)
299+
* Validation on server side is now triggered by the blur event
300+
* Now using class names that's compliant with twitter bootstrap 3.x
301+
300302
#### 2.1
301-
* Code refactoring and some functions renamed
302-
* Validator "checkbox_group" added
303+
* Code refactoring and some functions renamed
304+
* Validator "checkbox_group" added
303305

304306
#### 2.0.7
305307
* Now possible to validate file size, extension and mime type (using the file module)

‎form-validator/date.dev.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
*
1111
* @website http://formvalidator.net/#location-validators
1212
* @license Dual licensed under the MIT or GPL Version 2 licenses
13-
* @version 2.1.0
13+
* @version 2.1.5
1414
*/
1515
(function($) {
1616

‎form-validator/file.dev.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
*
1111
* @website http://formvalidator.net/
1212
* @license Dual licensed under the MIT or GPL Version 2 licenses
13-
* @version 2.1.0
13+
* @version 2.1.5
1414
*/
1515
(function($, window) {
1616

‎form-validator/form-test.html

Lines changed: 194 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,194 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Form Test</title>
6+
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0-wip/css/bootstrap.min.css" />
7+
<style>
8+
9+
/* Form and inputs */
10+
form {
11+
width: 500px;
12+
padding: 20px;
13+
}
14+
15+
input.form-control {
16+
width: 375px;
17+
}
18+
19+
/* While server is being requested */
20+
form.validating-server-side {
21+
background: #F2F2F2;
22+
opacity: 0.7;
23+
}
24+
25+
/* modify inputs for password strength */
26+
.password-strength input.form-control {
27+
width: 375px;
28+
margin-right: 4px;
29+
display: inline;
30+
}
31+
32+
.password-strength label {
33+
display: block;
34+
}
35+
36+
/* Checkboxes */
37+
.form-group.check-boxes input {
38+
margin-left: 10px;
39+
}
40+
41+
</style>
42+
</head>
43+
<body>
44+
<div>
45+
<form action="" id="test-form" role="form">
46+
<div class="form-group">
47+
<label class="control-label" for="inline-suggestions">Inline suggestions</label>
48+
<input type="text" id="inline-suggestions" class="form-control" data-suggestions="Monkey, Horse, Fox, Tiger, Elephant" />
49+
</div>
50+
51+
<div class="form-group">
52+
<label class="control-label" for="country-suggestions">Country suggestions</label>
53+
<input type="text" id="country-suggestions" class="form-control" />
54+
</div>
55+
56+
<div class="form-group">
57+
<label class="control-label" for="country-suggestions">Swedish county suggestions</label>
58+
<input type="text" id="swedish-county-suggestions" class="form-control" />
59+
</div>
60+
61+
<div class="form-group password-strength">
62+
<label class="control-label" for="password">Display password strength (only strong)</label>
63+
<input type="password" id="password" class="form-control" data-validation="strength" data-validation-strength="3" />
64+
</div>
65+
66+
<div class="form-group">
67+
<label class="control-label">Alphanumeric and -_ and spaces</label>
68+
<input class="form-control" name="test" data-validation="alphanumeric" data-validation-allowing="-_ " />
69+
</div>
70+
71+
<div class="form-group">
72+
<label class="control-label">Alphanumeric only</label>
73+
<input class="form-control" name="test2" data-validation="alphanumeric" />
74+
</div>
75+
76+
<div class="checkbox">
77+
<label>
78+
<input type="checkbox" data-validation="required" /> Must be checked
79+
</label>
80+
</div>
81+
82+
<div class="form-group">
83+
<label class="control-label">Even numbers only</label>
84+
<input class="form-control" name="test4" data-validation="even_number" />
85+
</div>
86+
87+
<div class="form-group">
88+
<label class="control-label">Optional Server validation</label>
89+
<input class="form-control" name="code"
90+
data-validation-help="The word is &quot;secret&quot;"
91+
data-validation-optional="true"
92+
data-validation="server"
93+
data-validation-url="http://formvalidator.net/validate-email.php" />
94+
</div>
95+
96+
<div class="form-group">
97+
<label class="control-label">File validation</label>
98+
<input type="file" name="some-file" class="form-control"
99+
data-validation="size mime"
100+
data-validation-allowing="jpg, png, ico"
101+
data-validation-max-size="100kb" />
102+
</div>
103+
104+
<div class="form-group">
105+
<label class="control-label">
106+
Callback validation, set this value to &quot;1&quot; and
107+
validation will fail
108+
</label>
109+
<input id="callback" class="form-control" />
110+
</div>
111+
112+
<div class="form-group check-boxes">
113+
<label>Checkbox group</label><br />
114+
<label>
115+
<input type="checkbox" name="box" value="1"
116+
data-validation="checkbox_group"
117+
data-validation-qty="1-2" /> 1
118+
</label>
119+
<label>
120+
<input type="checkbox" name="box" value="2" /> 2
121+
</label>
122+
<label>
123+
<input type="checkbox" name="box" value="3" /> 3
124+
</label>
125+
<label>
126+
<input type="checkbox" name="box" value="4" /> 4
127+
</label>
128+
<label>
129+
<input type="checkbox" name="box" value="5" /> 5
130+
</label>
131+
</div>
132+
<p>
133+
<input type="submit" class="button">
134+
</p>
135+
</form>
136+
</div>
137+
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
138+
<script src="jquery.form-validator.js"></script>
139+
<script src="//code.jquery.com/qunit/qunit-1.12.0.js"></script>
140+
<script>
141+
(function($) {
142+
143+
var dev = window.location.hash.indexOf('dev') > -1 ? '.dev' : '';
144+
145+
$.validationSetup({
146+
language : {
147+
requiredFields: 'Du måste bocka för denna'
148+
},
149+
errorMessagePosition : 'top',
150+
scrollToTopOnError : true,
151+
modules : 'security'+dev+', location'+dev+', sweden'+dev+', file'+dev+', uk'+dev,
152+
onModulesLoaded: function( $form ) {
153+
$('#country-suggestions').suggestCountry();
154+
$('#swedish-county-suggestions').suggestSwedishCounty();
155+
$('#password').displayPasswordStrength();
156+
},
157+
onValidate : function() {
158+
var $callbackInput = $('#callback');
159+
if( $callbackInput.val() == 1 ) {
160+
return {
161+
element : $callbackInput,
162+
message : 'This validation was made in a callback'
163+
};
164+
}
165+
},
166+
onError : function() {
167+
if( !$.formUtils.haltValidation ) {
168+
alert('Invalid');
169+
}
170+
},
171+
onSuccess : function() {
172+
alert('Valid');
173+
return false;
174+
}
175+
});
176+
177+
// Load one module outside $.validationSetup() even though you do not have to
178+
$.formUtils.loadModules('date'+dev+'.js', false, false);
179+
180+
// Add a new validator
181+
$.formUtils.addValidator({
182+
name : 'even_number',
183+
validatorFunction : function(value, $el, config, language, $form) {
184+
return parseInt(value, 10) % 2 === 0;
185+
},
186+
borderColorOnError : '',
187+
errorMessage : 'You have to give an even number',
188+
errorMessageKey: 'badEvenNumber'
189+
});
190+
191+
})(jQuery);
192+
</script>
193+
<body>
194+
</html>

0 commit comments

Comments
 (0)