@@ -97,15 +97,15 @@ Read the documentation for the date module at [#date-validators](#date-validator
97
97
* Suggest countries (english only)
98
98
* Suggest states in the US
99
99
100
- Read the documentation for the location module at [ http://formvalidator.net/ #location-validators] ( http://formvalidator.net /#location-validators)
100
+ Read the documentation for the location module at [ #location-validators] ( /#location-validators )
101
101
102
102
### Module: file
103
103
* ** mime**
104
104
* ** extension**
105
105
* ** size** (file size)
106
106
* ** dimension** (size dimension and ratio)
107
107
108
- Read the documentation for the file module at [ http://formvalidator.net/ #file-validators] ( http://formvalidator.net/ #file-validators)
108
+ Read the documentation for the file module at [ #file-validators] ( #file-validators )
109
109
110
110
### Module: logic
111
111
@@ -749,6 +749,133 @@ This validator is the same as the default <a href="#default-validators_dates">da
749
749
<input type="text" data-validation="time">
750
750
```
751
751
752
+
753
+ ## Location validators
754
+
755
+ ### Country
756
+
757
+ ```
758
+ <!-- Validate country (english only) -->
759
+ <input type="text" data-validation="country"/>
760
+ ```
761
+
762
+ ### State (US)
763
+
764
+ ```
765
+ <!-- Validate US state -->
766
+ <input type="text" data-validation="federatestate"/>
767
+ ```
768
+
769
+ ### Longitude and Latitude
770
+
771
+ ```
772
+ <!-- Validate longitude and latitude (eg 40.714623,-74.006605) -->
773
+ <input type="text" data-validation="longlat"/>
774
+ ```
775
+
776
+ ### Suggest country/state
777
+
778
+ By using this function you'll make it easier for your visitor to input a country or state.
779
+
780
+ ```
781
+ <form action="">
782
+ ...
783
+ <p>
784
+ <strong>Which country are you from?</strong>
785
+ <input name="user_country" data-validation="country"/>
786
+ </p>
787
+ <p>
788
+ <strong>Which state do you live in?</strong>
789
+ <input name="user_home_state" data-validation="federatestate"/>
790
+ </p>
791
+ </form>
792
+ </div>
793
+ <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
794
+ <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-form-validator/2.3.26/jquery.form-validator.min.js"></script>
795
+ <script>
796
+ $.validate({
797
+ modules : 'location',
798
+ onModulesLoaded : function() {
799
+ $('input[name="user_country"]').suggestCountry();
800
+ $('input[name="user_home_state"]').suggestState();
801
+ }
802
+ });
803
+ </script>
804
+ ```
805
+
806
+ ## File validators
807
+
808
+ ### File size
809
+
810
+ This validation is only supported by Internet Explorer 10, Mozilla FireFox v >= 3.6 and any of the later versions of webkit based browsers.
811
+
812
+ ```
813
+ <!-- Validate that file isn't larger than 512 kilo bytes -->
814
+ <input type="file" data-validation="size" data-validation-max-size="512kb" />
815
+
816
+ <!-- Validate that file isn't larger than 3 mega bytes -->
817
+ <input type="file" data-validation="size" data-validation-max-size="3M" />
818
+ ```
819
+
820
+ ### File type
821
+
822
+ This validation will fall back on checking the file extension in older browsers. In modern browsers the validation will check that any of the extensions in <code >data-validation-allowing</code > exists in the mime type declaration of the file. This means that <code >data-validation-allowing="pdf"</code > will work in both modern browsers (checking against "application/pdf") and older browsers (checking the file extension ".pdf").
823
+
824
+ ```
825
+ <!-- Validate that file is an image of type JPG, GIF or PNG and not larger than 2 mega bytes -->
826
+ <input type="file" data-validation="mime size" break0="" data-validation-allowing="jpg, png, gif" break=""
827
+ data-validation-max-size="2M" />
828
+
829
+ <!-- Validate that a file is given and that it has .txt as extension -->
830
+ <input type="file" data-validation="required extension" data-validation-allowing="txt" />
831
+ ```
832
+
833
+ Validating multiple files (with separate error messages depending on failed validation):
834
+
835
+ ```
836
+ <input type="file" multiple="multiple" name="images"
837
+ data-validation="length mime size"
838
+ data-validation-length="min2"
839
+ data-validation-allowing="jpg, png, gif"
840
+ data-validation-max-size="512kb"
841
+ data-validation-error-msg-size="You can not upload images larger than 512kb"
842
+ data-validation-error-msg-mime="You can only upload images"
843
+ data-validation-error-msg-length="You have to upload at least two images"
844
+ />
845
+ ```
846
+
847
+ ### Image dimension and ratio
848
+
849
+ Use the validator <code >dimension</code > to check the dimension of an image (jpg, gif or png).
850
+
851
+ ```
852
+ <!-- Validate that the image is no smaller than 100x100px -->
853
+ <input data-validation="dimension mime" data-validation-allowing="jpg" break="" data-validation-dimension="min100" />
854
+
855
+ <!-- Validate that the image is no smaller than 300x500 px (width/height) -->
856
+ <input data-validation="dimension mime" data-validation-allowing="jpg" break="" data-validation-dimension="min300x500" />
857
+
858
+ <!-- Validate that the image is no larger than 500x1000 px -->
859
+ <input data-validation="dimension mime" data-validation-allowing="jpg" break="" data-validation-dimension="max500x1000" />
860
+
861
+ <!-- Validate that the image is no smaller than 100x100 px and no larger than 800x800 -->
862
+ <input data-validation="dimension mime" data-validation-allowing="jpg" break="" data-validation-dimension="100-800" />
863
+
864
+ <!-- Validate that the image is no smaller than 200x400 px and no larger than 600x1200 -->
865
+ <input data-validation="dimension mime" data-validation-allowing="jpg" break="" data-validation-dimension="200x400-600x1200" />
866
+ ```
867
+
868
+ Use the attribute <code >data-validation-ratio</code > to validate that the uploaded image has a certain ratio
869
+
870
+ ```
871
+ <!-- Validate that only square images gets uploaded -->
872
+ <input data-validation="ratio mime" data-validation-allowing="jpg, png, gif" break="" data-validation-dimension="min100" data-validation-ratio="1:1" />
873
+
874
+ <!-- Validate that only somewhat square images gets uploaded -->
875
+ <input data-validation="ratio mime" data-validation-allowing="jpg" break="" data-validation-dimension="min100" data-validation-ratio="8:10-12:10" />
876
+ ```
877
+
878
+
752
879
## Changelog
753
880
754
881
#### 2.3.19
0 commit comments