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.