Easyui (data validation)

<%@ page language= "java" import= "java.util.*" pageencoding= "Utf-8"%> <%@ include file= "/include/taglibs.jsp" %> <link rel= "stylesheet" href= "${pagecontext.request.contextpath}/css/qiantu_alert.min.css" > &
            Lt;div class= "Qiantu-content" > <!--TODO title--<p class= "title" > Request </p>
                    <!--TODO Content--<div class= "Content-box" > <form id= "Qiantuform" > <!--TODO Monthly repayment amount-<div class= "Month-payment" > <lab
                        el><span>*</span> amount:</label> <input type= "text" name= "Month-payment" >
                    <i class= "unit" > Meta </i> <p class= "error" ></p> </div> <!--TODO Request Repayment amount-<div class= "Apply-payment" &
                        Gt <label><span>*</span> amount:</label> <input type= "text" Name= "apply-payment
                    "> <i class=" unit "> Meta </i> <p class=" error "></p> </div> <!--TODO terms-<div class= "Replace-lim It "> <label><span>*</span> term:</label> <div class= "Select-list" > <span>--Please select--</span> <ul cl ass= "LF" > <li class= "active" >1 months </li> <l
                            I&GT;2 months </li> <li>3 months </li> </ul> <!--TODO Small triangle--<p class= "Arrow" ><b></b></p&
                    Gt    </div> <p class= "error" ></p> </div> <!--TODO Date--<div class= "Month-pay-date" > <label>&lt ;span>*</span> Date:</label> <div id= "Datediv" class= "Appoint-time" onclick= "DateC Lick () "> <input type=" text "id=" Date-picker "placeholder=" Click here to select the date "Name=" Month-pay-date "ReadOnly Valu E= "${house. Bug_year} "> <b class=" Date-icon "></b> </div> & lt;! --<input type= "text" name= "month-pay-date" readonly id= "Date-picker" placeholder= "please click here to select the date" onclick= "Showdatebox
                        (event) "> <!--<p class=" Date-unit "> Day </p> TODO Date selection box <div class= "Datepicker-box" onclick= "Showdatebox (event)" > &LT;DIV&G T;<a href= "javascript:; "class=" Date-clear "onclick=" Dateclear (event) "> Emptying </a></div> &LT;/DIV&G T --<p class= "error" ></p> </div> <
                    !--Todo Horizontal dash-<p class= "Across-line" ></p> <!--TODO bank card number-- <div class= "Payback-bank" > <label><span>*</span> bank card number: & lt;/label> <input type= "text" name= "Payback-bank" > <p class= "E  Rror "></p> </div> <!--TODO Bank--<div
                        class= "Bank-of-deposit" > <label><span>*</span> Bank:</label> <input type= "text" name= "Bank-of-deposit-name" > <!--<input type= "text" n Ame= "bank-of-deposit-Branch ">--> <p class=" error "></p> </div> <!--TODO Mobile number--<div class= "Telphone-num" > &LT;LABEL&GT;&L T;span>*</span> mobile phone number:</label> <input type= "text" name= "Telphone-num" maxlength= " "> <a href=" javascript:; "class=" Get-availcode "maxlength=" 6 "onclick=" Getavailcode () ">
                    Get Verification Code </a> <p class= "error" ></p> </div> <!--TODO Phone Verification code--<div class= "Telphone-code" > &LT;LABEL&GT;&L
                        T;span>*</span> Mobile Verification Code:</label> <input type= "text" name= "Telphone-code" > <p class= "Error" ></p> </div> <!--TODO Dashed line-
                  -  <p class= "Across-line" ></p> <!--TODO Submit Request button-<a href= "JAV
            Ascript:; "class=" submitapply-btn "onclick=" submitmonthapply () "> Submit Request </a> </form>
        </div> <!--Close button-<i class= "close-btn" onclick= "closebtn ()" ></i> </div> <script src= "${pagecontext.request.contextpath}/js/qiantu_alert.min.js" ></script> </ Body>  
 
 
 
/** * Created by Administrator on 2017/2/10.
    *//*$ (document). Click (function () {$ (". Select-list>ul"). Removeclass ("active");
$ (". Select-list>b"). Removeclass ("Active")}); $ (". Select-list>span"). Click (function () {var b=arguments.callee.caller.arguments[0]| |
    Event if (b&&b.stoppropagation) {b.stoppropagation ()} else{if (window.event) {window.event.cancelbubble=true}} var
    a=$ (This). Next ("UL");
        if (!a.hasclass ("active")) {$ (". Select-list>ul"). Removeclass ("active");
        A.addclass ("active");
        $ (". Select-list>b"). Removeclass ("active"); $ (this). Next (). Next (). Find ("B"). AddClass ("Active")} else{a.removeclass ("active"); $ (this). Next ("B").
Removeclass ("Active")}); $ (document). On ("click", ". Select-list>ul>li", function () {$ (). Prev ("span"). HTML ($ (this). HTML ()
    ); $ (this). Parent (). Removeclass ("active");
    $ (this). Parent (). Next (). Find ("B"). Removeclass ("active"); $ ('. Replace-limit. Error '). HTML ('');
}); $ (document). On ("MouseOver", ". Select-list>ul>li", function () {$ (this). AddClass ("active"). Siblings (". Active" ). Removeclass ("Active")}); */* Date plug-in call */function Dateclick () {laydate ({elem: ' #date-picker ', Festival:true, M
			In:laydate.now (), Choose:function (datas) {showTime ();
			if ($ ("#date-picker"). val () = = "") {$ ("#dateDiv ~.error"). Text ("* Please select Date");
			}else{$ ("#dateDiv ~.error"). Text ("");
}
		}
	});
    /*todo Month Repayment Date SELECT */$ (window). Load (function () {var html= "";
    for (Var i=0;i<31;i++) {html+= ' <li onclick= "Datechoose (this,event)" > ' + (i+1) + ' </li> ';
} $ ('. Datepicker-box '). Prepend ($ (' <ul> '). Append (HTML));

});

$ (document). Click (function () {$ ('. Datepicker-box '). Hide ();}); /*todo Click Please select the date to display the date selection box */function Showdatebox (e) {var e=arguments.callee.caller.arguments[0]| |
    Event
    if (e && e.stoppropagation) {e.stoppropagation (); } else if (window.event) {window.event.cancelBubble = true;
} $ ('. Datepicker-box '). Show ();
    /*todo Date Selected */function Datechoose (dom,e) {$ (DOM). addclass ("active"). Siblings (". Active"). Removeclass ("active");
    $ (' #date-picker '). Val ($ (DOM). HTML ()); var e=arguments.callee.caller.arguments[0]| |
    Event
    if (e && e.stoppropagation) {e.stoppropagation ();
    } else if (window.event) {window.event.cancelBubble = true;
    } $ ('. Datepicker-box '). Hide ();
$ ('. Month-pay-date. Error '). html (');
    }/*todo Empty */function Dateclear (e) {$ (' #date-picker '). Val ('); var e=arguments.callee.caller.arguments[0]| |
    Event
    if (e && e.stoppropagation) {e.stoppropagation ();
    } else if (window.event) {window.event.cancelBubble = true;
} $ ('. Datepicker-box '). Hide ();          
               }/*todo Form Validation *///todo loses focus validation function MonthblurVali1 (JQ,REG,HTML1,HTML2) {Jq.blur (function () {          
               var val=$ (this). Val (); if (val== ""||
                   Val==null) {$ (this). Parent (). Find ('. Error '). HTML (HTML1);
               $ (this). focus (); }else if (!reg.test (val) | | val<3000| |
                  val>30000) {$ (this). Parent (). Find ('. Error '). HTML (HTML2); /* $ (this). focus (); */}else if ($ (". Month-payment input"). val ()! = "" "&&parsefloat (val) >parsefloat ($
                   (". Month-payment input"). Val ()) {$ (this). Parent (). Find ('. Error '). HTML ("*");
               /*$ (This). focus (); */}else{$ (this). The parent (). Find ('. Error '). html (');
      }
           }); } function MonthblurVali2 (JQ,REG,HTML1,HTML2) {Jq.blur (function () {var val=$ (this). V
                Al (); if (val== "" | |
                    Val==null) {$ (this). Parent (). Find ('. Error '). HTML (HTML1);
                $ (this). focus (); }else if (!reg.test (val)) {$ (this). Parent (). Find ('. ErroR '). HTML (HTML2);
                $ (this). focus ();
                }else{$ (this). Parent (). Find ('. Error '). html (');
        }
            }); } monthblurVali2 ($ ('. Month-payment input '),/^ ([1-9]\d* (\.\d*[1-9])?) |
(0\.\d*[1-9]) $/, ' * Please enter the amount ', ' * Please enter the correct amount '); MonthblurVali1 ($ ('. Apply-payment input '),/^ ([1-9]\d* (\.\d*[1-9])?) |

(0\.\d*[1-9]) $/, ' * Please enter the amount requested ', ' * Please enter the correct application amount (3000-30000) ');
MonthblurVali2 ($ ('. Payback-bank input '),/^ (\d{14}|\d{16}|\d{19}) $/, ' * Please enter the bank card number ', ' * Please enter the correct bank card number ');
MonthblurVali2 ($ ('. Bank-of-deposit input '),/[\u4e00-\u9fa5]/, ' * Please enter the bank ', ' * Please enter the correct bank ');
MonthblurVali2 ($ ('. Telphone-num input '),/^1[34578]\d{9}$/, ' * Please enter the mobile number ', ' * Please enter the correct mobile number ');


MonthblurVali2 ($ ('. Telphone-code input '),/^\d{6}$/, ' * Please enter the phone verification code ', ' * Please enter the correct phone verification code ');
/*todo Click to get Verification code */var idx; function Getavailcode () {if ($ ('. Telphone-num input '). val () = = "") {$ ('. Telphone-num input '). Parent (). Find ('. Erro
        R '). HTML (' * Please enter mobile number ');
        $ ('. Telphone-num input '). focus ();
    Return } LayUi.use (' Layer ', function () {var layer = Layui.layer; IDX = Layer.open ({type:1, id: "Img-code", Title: ' Please enter the captcha ', Shift: 5, Content: ' <input type= ' "text" name= "title" Required placeholder= "Please enter verification code" autocomplete= "Off" class= "layui-  Input "id=" INPUT4 "><p> Verification Code incorrect &LT;/P&GT;&LT;IMG class=" layui-img "id=" imgobj "onclick=" ChangeCode (); " Src= "" > See <a id= "Imgobja" onclick= "ChangeCode ();" > Change a </a><div class= "Btns" ><button class= "layui-btn layui-btn-normal" onclick= "Alertyes ()" > Confirmation </button><button class= "layui-btn layui-btn-primary" onclick= "Cancel ()" > Cancel </button></div>
        '           
        });
    ChangeCode ();
}); }/* Click the popup to confirm the button callback */function Alertyes () {if ($ ("#input4"). val () = = = "") {$ ("#input4"). Next ("P"). HTML ("* Please enter the correct verification Code")
        ). Show ();
    Return
      if ($ ("#input4"). Val ()!== "") {$.ajax ({type: "POST",      URL: "/qtonline/checkcode.html", data:{code:$ ("#input4"). Val ()}, DataType: "JSON",
                	Async:false, Success:function (response) {if (response.msg== "fail") {
                    ChangeCode ();
                $ ("#input4"). Next ("P"). HTML ("* Please enter the correct verification Code"). Show ();                   
                    } else{$ ("#input4"). Next ("P"). Hide (); Checksum success $.ajax ({type: "POST", url: "/QTONLINE/SENDSM
                        S.html ", data:{phone:$ ('. Telphone-num input '). Val (), type:1,code:$ (" #input4 "). Val ()},
                            DataType: "JSON", success:function (response) {time ();
                            ChangeCode ();
                        Layer.close (IDX);
                    }
                    }); $ (". Get-availcode"). Removeattr ("OnclIck ");

    }
            }
        });

}///Click the popup Cancel button callback */function Cancel () {layer.close (idx);}
    function ChangeCode () {var d = math.random (100);
    $ ("#imgObj"). Removeattr ("src");
$ ("#imgObj"). attr ("src", "/qtonline/code.html?d=" +d); }/** Verification Code Countdown */Function time () {if (wait = = 0) {$ ('. Get-availcode '). attr (' href ', ' javascript:; ').
        Removeclass (' Disable ');
        $ ('. Get-availcode '). attr (' onclick ', ' getavailcode () ');
        $ ('. Get-availcode '). Text ("Get Verification Code");
    wait = 60;
        } else {$ ('. Get-availcode '). Removeattr (' href '). addclass (' disable ');
        $ ('. Get-availcode '). Removeattr ("onclick");
        $ ('. Get-availcode '). Text ("Resend (" + Wait + ")");
        wait--;
            Timer = setTimeout (function () {time ();
    }, 1000);
    }}/*todo Click submit Request */function submitmonthapply () {var monthpay=$ ('. month-payment input ');
    var applypay=$ ('. apply-payment input '); var replacelimit=$ ('. RePlace-limit. Select-list span ');
    var monthpaydate=$ ('. month-pay-date input ');
    var paybackbank=$ ('. Payback-bank input ');
    var bankofdeposit=$ ('. bank-of-deposit input ');
    var telphonenum=$ ('. Telphone-num input ');
    
    var telphonecode=$ ('. Telphone-code input ');
        if (monthpay.val () = = "") {monthpay.parent (). Find ('. Error '). HTML (' * Please enter monthly amount ');
        Monthpay.focus ();
    Return
        } if (applypay.val () = = "") {applypay.parent (). Find ('. Error '). HTML (' * Please enter the application amount ');
    /*applypay.focus (); */return; } if (Parsefloat (Applypay.val ()) >parsefloat (Monthpay.val ())) {applypay.parent (). Find ('. Error '). HTML (' * Application amount must not be greater than
        Monthly amount ');
        Applypay.focus ();
    Return
        } if (replacelimit.html () = = "--select--") {Replacelimit.parent (). Parent (). Find ('. Error '). HTML (' * Please select term ');
    Return
        } if (monthpaydate.val () = = "") {monthpaydate.parent (). Next ('. Error '). HTML (' * Please select Date ');
    Return } if (paybackbank.val () = = ""{paybackbank.parent (). Find ('. Error '). HTML (' * Please enter bank card number ');
        Paybackbank.focus ();
    Return
        } if (bankofdeposit.val () = = "") {bankofdeposit.parent (). Find ('. Error '). HTML (' * Please enter the account Bank ');
        Bankofdeposit.focus ();
    Return
        } if (telphonenum.val () = = "") {telphonenum.parent (). Find ('. Error '). HTML (' * Please enter mobile number ');
        Telphonenum.focus ();
    Return
        } if (telphonecode.val () = = "") {telphonecode.parent (). Find ('. Error '). HTML (' * Please enter Phone verification code ');
        Telphonecode.focus ();
    Return /** Verify the Phone Verification code */$.ajax ({type: "POST", url: "/qtonline/istherightlvc.html", data: {Userphone:telph
				Onenum.val (), Lvc:telphonecode.val ()}, DataType: "JSON", Success:function (a) {if (a.msg = = "Fail") {
			Alert ("Please fill in the correct phone verification code"); }else{var data = {"Money": Monthpay.val (), "Apply_money": Applypay.val (), "APP
			    Ly_time ": replacelimit.html (). substr (0,1),    	"Apply_day": Monthpaydate.val (), "Bank_card": Paybackbank.val (), "Bank_name": Bankofdeposi
				 T.val (), "User_phone": Telphonenum.val ()};  $.ajax ({type: "POST", Data:data, url: "/qtonline/applyinfo/qiantu1.html", success
					    		: function (res) {if (res.result== "success") {alert (res.msg);
					    		$ (". Qiantu-mask"). Hide ();
					    		$ ("Body"). CSS ("overflow-y", "scroll");
				    		Checkdata ();
				    		}else{alert (res.msg);
			}
					}
				});	

}
		}
    });
	    	}//Check whether the profile is audited through function checkdata () {$.ajax ({url: "/qtonline/applyinfo/checkdata.html", type: "POST",
	    		 	DataType: "JSON", success:function (data) {if (data.result== "PASS") {$ (". Qiantu-mask"). Show ();
				 $ ("Body"). CSS ("overflow-y", "hidden");
					        }else{layui.use (' Layer ', function () {var layer = Layui.layer; Layer.confirm(' The personal information is not certified and the information is available to the personal center.
					        ', function () {location.href= "/qtonline/propublish/mymonthpay.html";
				    });
				 });
}
	    	}
		});
	}//Close button function Closebtn () {$ (". Qiantu-mask"). Hide ();
$ ("Body"). CSS ("overflow-y", "scroll"); }
 
 
 
Core approach: laydate (options);
  The options is an object that contains the following key: ' Default '
    elem: ' #id ',//element selector event to display the date
    : ' Click ',//Trigger Event
    format: ' Yyyy-mm-dd hh:mm : SS ',//date format
    Istime:false,//Whether to open time select
    isclear:true,//whether to display empty
    istoday:true,//whether to show today
    Issure:true, Whether to show confirmation
    festival:true//Show holiday
    min: ' 1900-01-01 00:00:00 ',//Minimum date
    max: ' 2099-12-31 23:59:59 ',//maximum date
    start: ' 2014-6-15 23:00:00 ',  //start date
    Fixed:false,//whether fixed in viewable area
    zindex:99999999,//css z-index
    choose:function (dates) {//Select a good date callback

    }