JQuery EasyUI common data verification summary, jqueryeasyui

Source: Internet
Author: User

JQuery EasyUI common data verification summary, jqueryeasyui

Validatebox () of easyui provides a custom verification method. For this reason, I have summarized some common data verification methods. The Code is as follows:

$. Extend ($. fn. validatebox. defaults. rules, {CHS: {validator: function (value, param) {return/^ [\ u0391-\ uFFE5] + $ /. test (value) ;}, message: 'enter Chinese characters'}, ZIP: {validator: function (value, param) {return/^ [1-9] \ d {5} $ /. test (value) ;}, message: 'zip Code does not exist'}, QQ: {validator: function (value, param) {return/^ [1-9] \ d {4, 10} $ /. test (value) ;}, message: 'qq number incorrect '}, mobile: {validator: function (value, p Aram) {return/^ (\ d {2, 3} \) | (\ d {3 }\-))? 13 \ d {9} $ /. test (value) ;}, message: 'incorrect mobile phone number'}, loginName: {validator: function (value, param) {return/^ [\ u0391-\ uFFE5 \ w] + $ /. test (value) ;}, message: 'logon names can only contain Chinese characters, English letters, numbers, and underscores. '}, Safepass: {validator: function (value, param) {return safePassword (value) ;}, message: 'password consists of letters and numbers, at least 6 bits '}, failed to: {validator: function (value, param) {return value ==$ (param [0]). val () ;}, message: 'Two input characters are different to '}, number: {validator: function (value, param) {return/^ \ d + $ /. test (value) ;}, message: 'Enter the number'}, idcard: {validator: function (value, param) {return idCard (value) ;}, messa Ge: 'Enter the correct ID card number '});/* The password consists of letters and numbers, at least 6 digits */var safePassword = function (value) {return! (/^ ([A-Z] * | [a-z] * | \ d * | [-_\~! @ # \ $ % \ ^ & \ * \. \ (\) \ [\] \ {\} <> \? \/\ '\ "] *) |. {0, 5}) $ | \ s /. test (value);} var idCard = function (value) {if (value. length = 18 & 18! = Value. length) return false; var number = value. toLowerCase (); var d, sum = 0, v = '10x98765432', w = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2], a = '11, 12, 13, 22, 31, 45, 46, 50, 51, 61, 64, 65, '; var re = number. match (/^ (\ d {2}) \ d {4} (\ d {2}) (\ d {2}) (\ d {2 }) (\ d {3}) | (\ d {4}) (\ d {2}) (\ d {2 }) (\ d {3} [x \ d]) $/); if (re = null |. in DexOf (re [1]) <0) return false; if (re [2]. length = 9) {number = number. substr (0, 6) + '19' + number. substr (6); d = ['19' + re [4], re [5], re [6]. join ('-');} else d = [re [9], re [10], re [11]. join ('-'); if (! IsDateTime. call (d, 'yyyy-MM-dd') return false; for (var I = 0; I <17; I ++) sum + = number. charAt (I) * w [I]; return (re [2]. length = 9 | number. charAt (17) = v. charAt (sum % 11);} var isDateTime = function (format, reObj) {format = format | 'yyyy-MM-dd'; var input = this, o ={}, d = new Date (); var f1 = format. split (/[^ a-z] +/gi), f2 = input. split (/\ D +/g), f3 = format. split (/[a-z] +/gi), f4 = inpu T. split (/\ d +/g); var len = f1.length, len1 = f3.length; if (len! = F2.length | len1! = F4.length) return false; for (var I = 0; I <len1; I ++) if (f3 [I]! = F4 [I]) return false; for (var I = 0; I <len; I ++) o [f1 [I] = f2 [I]; o. yyyy = s (o. yyyy, o. yy, d. getFullYear (), 9999, 4); o. MM = s (o. MM, o. m, d. getMonth () + 1, 12); o. dd = s (o. dd, o. d, d. getDate (), 31); o. hh = s (o. hh, o. h, d. getHours (), 24); o. mm = s (o. mm, o. m, d. getMinutes (); o. ss = s (o. ss, o. s, d. getSeconds (); o. ms = s (o. ms, o. ms, d. getMilliseconds (), 999, 3); if (o. yyyy + o. MM + o. dd + o. hh + O. mm + o. ss + o. ms <0) return false; if (o. yyyy <100) o. yyyy + = (o. yyyy> 30? 1900: 2000); d = new Date (o. yyyy, o. MM-1, o. dd, o. hh, o. mm, o. ss, o. ms); var reVal = d. getFullYear () = o. yyyy & d. getMonth () + 1 = o. MM & d. getDate () = o. dd & d. getHours () = o. hh & d. getMinutes () = o. mm & d. getSeconds () = o. ss & d. getMilliseconds () = o. ms; return reVal & reObj? D: reVal; function s (s1, s2, s3, s4, s5) {s4 = s4 | 60, s5 = s5 | 2; var reVal = s3; if (s1! = Undefined & s1! = ''|! IsNaN (s1) reVal = s1 * 1; if (s2! = Undefined & s2! = ''&&! IsNaN (s2) reVal = s2 * 1; return (reVal = s1 & s1.length! = S5 | reVal> s4 )? -10000: reVal ;}};

Jquery. js and easyui. min. js should be introduced to the page.

Use the following in html code:

<Table class = "grid" id = "uiform"> <tr> <td> Logon Name: </td> <input required = "true" id = "txtUsername" type = "text" class = "txt03"/> </td> <td> real name: </td> <input id = "txtTruename" validType = "CHS" required = "true" type = "text" class = "txt03"/> </td> </tr> <td> logon password: </td> <input validType = "safepass" required = "true" id = "txtPassword" name = "password" type = "password" class = "txt03 "/> </td> <td> Email: </td> <input id = "txtEmail" name = "email" validType = "email" type = "text" class = "txt03"/> </td> </tr> <td> ID card number: </td> <input validType = "idcard" id = "txtIdcard" name = "idcard" type = "text" class = "txt03"/> </td> <td> QQ: </td> <input validType = "QQ" id = "txtQq" name = "qq" type = "text" class = "txt03"/> </td> </tr> <td> mobile phone: </td> <input validType = "mobile" id = "txtMobile" name = "mobile" type = "text" class = "txt03"/> </td> <td> Telephone: </td> <input id = "txtTel" name = "tel" type = "text" class = "txt03"/> </td> </tr> <tr> <td> Home address: </td> <td colspan = "3"> <input validType = "failed to [txtMobile]" style = "width: 80% "id =" txtHomeaddr "name =" homeaddr "type =" text "class =" txt03 "/> </td> </tr> <td> note: </td> <td colspan = "3"> <input type = "text" style = "width: 80% "class =" txt03 "id =" txtRemark "> </textarea> </td> </tr> <td> </td> <td colspan =" 3 "> <input id =" Checkbox1 "type =" checkbox "/> <label> super administrator </label> <input id =" Checkbox2 "type =" checkbox "/> <label> disable </label> </td> </tr> </table>

This section of JS isEssential

$(function(){ $('#uiform input').each(function () {   if ($(this).attr('required') || $(this).attr('validType'))    $(this).validatebox();  }) });

So OK.

If the form has been verified at the time of submission, you can use the following code

Var flag = true; $ ('# uiform input '). each (function () {if ($ (this ). attr ('required') | $ (this ). attr ('validtype') {if (! $ (This). validatebox ('isvalid') {flag = false; return ;}}) if (flag) alert ('verified! '); Else alert (' Verification Failed! ');

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.