jQuery plugin : Validation in ASP.NET Master Pages

剛好要在asp.net master page 下使用jquery validation plugin來做欄位驗證，
但我的button又是使用ajax的方式，
是不能將表單產生sumbit的動作Orz，
所以有了以下的解決方法：

頁面上配置鈕

<input id="btnProdcut" type="button" value="送出" runat="server" onclick="MySubmit()"/>

首先先初始化驗證控制項

<script type="text/javascript">
$(document).ready(function() {
$("#aspnetForm").validate({
event:"keyup",
rules: {
<%=tbDesignName.UniqueID %>: {
minlength: 2,
maxlength:10,
required: true
},
<%=tbDesignNameEnglish.UniqueID %>: {             
minlength: 2,
maxlength:10,
required: true,
},
<%=tbDesignDesc.UniqueID %>: {             
minlength: 2,
maxlength:10,
required: true,
},
<%=tbDesignDescEnglish.UniqueID %>: {             
minlength: 2,
maxlength:50,
required: true,
}

},
messages: {
<%=tbDesignName.UniqueID %>: {
required: "設計名稱尚未填寫",
minlength: "設計名稱最小長度為 2",
maxlength: "設計名稱最大長度為 10"
},


<%=tbDesignDesc.UniqueID %>: {             
required: "設計描述尚未填寫",
minlength: "設計描述最小長度為 2",
maxlength: "設計描述最大長度為 10"
}
}
});
});
</script>

按鈕執行的鈕

function MySubmit() {
CancelSumbit();
if (FormValidate()) {
if (FileValidate()) {
//驗證成功
else {
//驗證失敗
}
});
}
else
alert("驗證失敗");

}

改由檢查錯誤訊息元素的css屬性 display:none確認驗證是否成功，

function FormValidate() {
var displayChecker = false;
//找出class=error的錯誤訊息元素
$("td .error").each(function(i, obj) {
//alert($(this).css("display"));
if ($(this).css("display") == "none")
displayChecker = true;//表示欄位都通過驗證
else
displayChecker = false;

});

if (displayChecker == true)
return true;
else
return false;
}

摸擬submit的動作來檢查欄位

function CancelSumbit() {
$("input:[type=submit]").submit();
return false;
}

Reference：
Using jQuery Validation in ASP.NET Master Pages
jQuery plugin: Validation的詳細使用