Validation controls jquery Validation engine simple custom regular expressions

First, the address of the control piece http://code.ciaoca.com/jquery/validation-engine/

How to use the site is very clear, I write this article is mainly used to record how to add a custom regular expression, this problem toss a few times, just to engage. Online also looked a lot, did not mention the point, perhaps I was too stupid to read.

Get to the point, this control is very powerful, the inside of the validation is enough for us to use, but sometimes our project needs may be more unique, there is no how to do? Then you have to write a regular and then match it, but I couldn't find it in the first place. Where to fill in the custom regular.

The above is written on the website, but this paragraph where to fill it? This file is introduced when we introduce the file<script src="js/jquery.validationEngine-zh_CN.js"></script>，是在这个文件里填！

Of course, the smart person may have found a place, but I am more stupid, until the end of the thought is not filled in the source file, sure enough.

' Everyname ': {
' Regex ': ' ^[\u4e00-\u9fa5]+$|^[0-9]*$|\ ',/* custom Regular expression */
' Alerttext ': ' Invalid name '/* * validation does not pass outdated hints */
}

This paragraph is I fill in the regular, is to match a name, the requirement is the number, the Chinese character, take out a "·", does not conform to the prompt error, conforms to pass, of course, this kind of ghost generally does not have the general rule, you have to write or merge.

Here I want to say a few small details, this is the problem that I encountered this time:

1. Remember to put the regex in quotation marks when you write the regular.

2. To make several regular combinations match, use ' | ' This vertical bar

3. Want to match a special character, such as my point "·", then only need to add a slash can be like \, or you have to match a word, for example, want to "JS" These two letters also meet the requirements, because our requirements are Chinese and digital, English is not meet the requirements,  I just want these two letters to meet the requirements. \js, that's all you got.

Next I'll talk about the basic usage of this control:

1 First introduction of files

<link rel="stylesheet" href="css/validationEngine.jquery.css">

<script src="js/jquery.js"></script><script src="js/jquery.validationEngine-zh_CN.js"></script><script src="js/jquery.validationEngine.js"></script>

2然后给表单添加id

<form id="form_id" ...>...</form>

3开始在表单中使用

<input id= "selectName1" type= "text" class= "Validate[required,custom[everyname]]" Data-errormessage-value-missing= "* Here is not blank" data-errormessage= "* Character format is not correct, please re-enter" />

First of all, all the validation is added in the class of input, validate[required] is required to fill in the meaning, and custom[everyname] is the regular matching requirements, specifically can see the site, I here everyname is my custom. I tried it. custom[] The interior can only be filled in one and it itself can only exist one, not multiple. The parentheses inside the validate[] can be filled in with multiple, separated by commas, but only one of the validate itself exists.

Validate[required,custom[number],maxsize[20],min[0]] This paragraph means this is a required field, and it can only be a number, the maximum number of input characters is 20, where the minimum value is 0

Data-errormessage-value-missing= "* Here is not blank" this paragraph temporarily understood that if it contains required, it will prompt this sentence, this sentence can be customized

Data-errormessage= "* Character format is incorrect, please re-enter" this paragraph of understanding for the time being, if not empty, then if not meet our custom regular and various requirements (only the number, the maximum number of input characters is 20, where the minimum is 0), then prompt this sentence, This statement can also be customized.

The above is the use of the summary, mainly to see for themselves, later if you can forget to turn back to see O (∩_∩) o~

Another record is that if the project has a start time and an end time, the requirement is that when the start time is selected, the end time will not be selected until the start time. Conversely, if the end time is selected, then the start time must be before the end time, and then not be selected. Need a JS to control. Because we are using the Bootstrap-datepicker this control, for the time being recorded here.

$ (". Times_ipt"). EQ (0). Change (function () {
$ (". Times_ipt"). EQ (1). DatePicker (' Setstartdate ', $ (this). Val ());
});
$ (". Times_ipt"). EQ (1). Change (function () {
$ (". Times_ipt"). EQ (0). DatePicker (' Setenddate ', $ (this). Val ());
});
$ (". times_p"). EQ (0). Change (function () {
$ (". times_p"). EQ (1). DatePicker (' Setstartdate ', $ (this). Val ());
});
$ (". times_p"). EQ (1). Change (function () {
$ (". times_p"). EQ (0). DatePicker (' Setenddate ', $ (this). Val ());
});

Validation controls jquery Validation engine simple custom regular expressions