jquery validate案例1

時間 2019-12-07
原文原文鏈接
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-invIncomeInvoice-add">
	<div class="form-group">	
		<label class="col-sm-3 control-label">發票類型：</label>
		<div class="col-sm-8">
			<select id="invoiceType" name="invoiceType" class="form-control m-b">
				<option value="page_special_invoice">增值稅專用發票（紙質）</option>
				<option value="page_invoice">增值稅普通發票（紙質）</option>
				<option value="elec_invoice">增值稅普通發票（電子）</option>
			</select>
		</div>
	</div>
	<div class="form-group">	
		<label class="col-sm-3 control-label">發票代碼：</label>
		<div class="col-sm-8">
			<input id="invoiceCode" name="invoiceCode" class="form-control" type="text">
		</div>
	</div>
	<div class="form-group">	
		<label class="col-sm-3 control-label">發票號碼：</label>
		<div class="col-sm-8">
			<input id="invoiceNo" name="invoiceNo" class="form-control" type="text">
		</div>
	</div>
	<div class="form-group">	
		<label class="col-sm-3 control-label">開日期：</label>
		<div class="col-sm-8">
			<input id="invoiceDate" name="invoiceDate" class="form-control" type="text">
		</div>
	</div>
	<div class="form-group">	
		<label class="col-sm-3 control-label">價稅合計：</label>
		<div class="col-sm-8">
			<input id="totalTax" name="totalTax" class="form-control" type="text" placeholder="增值稅專用發票必填">
		</div>
	</div>
	<div class="form-group">	
		<label class="col-sm-3 control-label">校驗碼：</label>
		<div class="col-sm-8">
			<input id="antiFakeCode" name="antiFakeCode" class="form-control" type="text" placeholder="後六位，增值稅普通發票必填">
		</div>
	</div>
		</form>
	</div>
    <div>
    <script type="text/javascript">
		var prefix = ctx + "invoice/invIncomeInvoice"
		$("#form-invIncomeInvoice-add").validate({
			debug: true,
			rules : {
				invoiceCode : {
					required : true,
					check_invoiceCode : true
				},
				invoiceNo : {
					required : true,
					check_invoiceNo : true
				},
				invoiceDate : {
					required : true,
					dateISO : true
				},
				totalTax : {
					required : true,
					check_totalTax : true
				}
			}

		});
		
		
		$.validator.addMethod("check_invoiceCode",function(value,element,params){
				var check = /\d{6,15}$/;
				return this.optional(element)||(check.test(value));
			},"*只容許8-15位數字！");
		$.validator.addMethod("check_invoiceNo",function(value,element,params){
				var check = /\d{6,15}$/;
				return this.optional(element)||(check.test(value));
			},"*只容許8-15位數字！");
		
		$.validator.addMethod("check_totalTax",function(value,element,params){
				var check =  /^\d+\.?\d{0,2}$/;
				var invoiceType = $("#invoiceType").val();
				if(invoiceType=='page_special_invoice'){
					return this.optional(element)||(check.test(value));
				}
				return true;
			},"*保留兩位小數的金額！");
		
		function submitHandler() {
	        if ($.validate.form()) {
	            $.operate.save(prefix + "/add", $('#form-invIncomeInvoice-add').serialize());
	        }
	    }
	</script>
</body>
相關標籤/搜索