1
1
2
2
The goal of this project is to create a feature rich jQuery plugin used for validating form data and that
3
3
keeps the HTML code clean from javascript logic. Even though the plugin has ** a wide range of validation functions**
4
- it's designed to consume the least amount bandwidth as possible (which makes it very suitable for ** mobile websites** ).
4
+ it's designed to consume the least amount of bandwidth as possible (which makes it very suitable for ** mobile websites** ).
5
5
This is achieved by grouping together functions in "modules", making it possible for the programmer
6
6
to load ** only those functions that's needed** to validate a particular form.
7
7
@@ -16,7 +16,7 @@ to load **only those functions that's needed** to validate a particular form.
16
16
$ .formUtils .loadModules (' date,security' );
17
17
</script >
18
18
</head >
19
- <form action =" " onsubmit =" return $(this).validate()" >
19
+ <form action =" " onsubmit =" return $(this).validate(); " >
20
20
<p >
21
21
Name (4 characters minimum):
22
22
<input name =" user" data-validation =" validate_min_length length4" />
@@ -126,12 +126,37 @@ The validation function takes these five arguments:
126
126
127
127
## Creating a custom module
128
128
129
- A module is simply a script file containing one or more calls to ` $.formUtils.addValidator() ` .
129
+ A "module" is basically a script file containing one or more calls to [ $.formUtils.addValidator()] ( #writing-a-custom-validator ) . The module file
130
+ should either have the extension * .js* (as an ordinary javascript file) or * .dev.js* .
131
+
132
+ Using the extension ** .dev.js** will make the module loading function to always append a timestamp to the end of the
133
+ URL, so that the browser never caches the file. You should of course never use * .dev.js* on a production website.
134
+
135
+ ### Loading your module ###
136
+
137
+ ```
138
+ <html>
139
+ <head>
140
+ <script src="js/formvalidator/jquery.formvalidator.min.js"></script>
141
+ <script>
142
+ $.formUtils.loadModules('mymodule.dev', 'js/validation-modules/');
143
+ </script>
144
+ </head>
145
+ </html>
146
+ ...
147
+ ```
148
+
149
+ The first argument of $.formUtils.loadModules is a comma separated string with names of module files, without
150
+ extension (add .dev if the file name is for example mymodule.dev.js, this will insure that the browser never
151
+ caches the javascript).
130
152
153
+ The second argument is the path where the module files is located. This argument is optional, if not given
154
+ the module files has to be located in the same directory as the core modules shipped together with this jquery plugin
155
+ (js/formvalidator/)
131
156
132
157
133
158
## Validate inputs on blur
134
- It is now possible to show that the value of an input is incorrect immediately when the input gets blurred.
159
+ It is possible to show that the value of an input is incorrect immediately when the input gets blurred.
135
160
136
161
``` html
137
162
<form action =" " onsubmit =" return $(this).validate();" id =" my_form" >
0 commit comments