Jquery表單驗證外掛–Validform

Validform:

Jquery表單驗證外掛–Validform：一行程式碼搞定整站的表單驗證！

Validform 官網

 

jquery.form.js:

jquery.form.js中的ajaxSubmit

 

1.

<script src="/js/jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="/js/Validform_v5.3.2_min.js"></script>
<script src="/js/jquery.form.js"></script>

<form action="/union/saveJoin.do" method="post" id="form1" class="registerform">
	<table border="0" cellpadding="0" cellspacing="1" width="800" >	
		<tr>
			<td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 姓名 </td>
			<td width="600" valign="middle"><input class="shout" type="text" name="username" id="username" datatype="s2-12" errormsg="姓名至少2個字元,最多12個字元！" nullmsg="請填寫姓名！" ></td>
		</tr>
		<tr>
			<td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 手機 </td>
			<td width="600" valign="middle"><input class="shout" type="text" name="mobile" id="mobile" datatype="m" errormsg="手機號碼格式不正確！" nullmsg="請填寫手機號碼！"></td>
		</tr>
		<tr>
			<td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 郵箱 </td>
			<td width="600" valign="middle"><input type="text" name="email" id="email" datatype="e" errormsg="郵箱格式不正確！" nullmsg="請填寫郵箱！"></td>
		</tr>
		<tr>
			<td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 身份證號 </td>
			<td width="600" valign="middle"><input type="text" name="idcard" id="idcard" datatype="*"  nullmsg="請填寫身份證號！"></td>
		</tr>						
		
		<tr>
			<td width="200" height="60" align="right" valign="middle" style="padding-right: 20px;"> </td>
			<td width="600" valign="middle">
				<input class="btn" type="submit" value="提交資料">
			</td>
		</tr>
	</table>
	<span id="checkButton"></span>
</form>

 

JS :

$(function() {
	$(".registerform").Validform({
    	btnSubmit:"#checkButton",
    	tiptype:function(msg){
			if(msg != ''){
				showmsg(msg);
			}
		},
		tipSweep:true,
		beforeSubmit:function(){
			saveAccount();
			return false;
		}
	});
});

function saveAccount(){
	
	$("#form1").ajaxSubmit(function(data) {
		data = eval('(' + data + ')');
		if(data.code == 0){	
		}else if(data.code == -1){			
		}else{
			alert("系統繁忙，請稍後重試!");
		}
	 });
	
	return false;
}

 

...