Asp.net母版頁(yè)情況下如何進(jìn)行jquery.validate驗(yàn)證

說(shuō)實(shí)話，母版頁(yè)真是一個(gè)讓人又愛(ài)又恨的東西，為什么這么說(shuō)呢？

南開(kāi)ssl適用于網(wǎng)站、小程序/APP、API接口等需要進(jìn)行數(shù)據(jù)傳輸應(yīng)用場(chǎng)景，ssl證書(shū)未來(lái)市場(chǎng)廣闊！成為成都創(chuàng)新互聯(lián)的ssl證書(shū)銷售渠道，可以享受市場(chǎng)價(jià)格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：18982081108（備注：SSL證書(shū)合作）期待與您的合作！

因?yàn)槲覀冊(cè)诓皇褂媚赴骓?yè)的時(shí)候還沒(méi)有發(fā)現(xiàn)我們的代碼有多少問(wèn)題，結(jié)果加上母版頁(yè)之后問(wèn)題卻一個(gè)接著一個(gè)來(lái)，而且都是讓人感覺(jué)崩潰的。

廢話不說(shuō)了，母版頁(yè)其實(shí)還是挺好的，要不我干嘛非得要知道jquery.validate如何在母版頁(yè)下進(jìn)行表單驗(yàn)證呢？

下面我用兩個(gè)visual studio 版本來(lái)說(shuō)一下關(guān)于母版頁(yè)和jquery.validate驗(yàn)證的問(wèn)題

首先，visual studio 2005下

大家都知道通常母版頁(yè)的格式是這樣的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>XX系統(tǒng)</title>
<link href="Style/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<div>
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td rowspan="3">
<h2 class="DDMainHeader">XX系統(tǒng)</h2>
</td>
<td colspan="2">
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label1" runat="server" Text="用戶名:"></asp:Label>
</td>
<td>
<asp:Label ID="lbUserName" runat="server" ></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:Label ID="Label2" runat="server" Text="身份:"></asp:Label>
</td>
<td>
<asp:Label ID="lbRole" runat="server" ></asp:Label>
</td>
</tr>
</table>
</div>
<form id="form1" runat="server">
<div>
<%-- TODO: 通過(guò)將 EnablePartialRendering 特性設(shè)置為“true”啟用部分呈現(xiàn)以提供更平穩(wěn)的瀏覽體驗(yàn)。
在開(kāi)發(fā)應(yīng)用程序的過(guò)程中，將部分呈現(xiàn)保持為禁用狀態(tài)可提供更好的調(diào)試體驗(yàn)。 --%>
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="false"/>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>

這里大家要注意表單form1包住<asp:ContentPlaceHolder />控件，而我們都知道內(nèi)容頁(yè)就是寫(xiě)在每個(gè)對(duì)應(yīng)的<asp:ContentPlaceHolder />這個(gè)控件里的。所以我們會(huì)發(fā)現(xiàn)一個(gè)問(wèn)題，就是整個(gè)被母版頁(yè)‘限制’的aspx頁(yè)其實(shí)只有一個(gè)form id，那就是這個(gè)母版頁(yè)里的form1了。

乍看一下好像沒(méi)有什么，但是大家仔細(xì)想想，如果要用到j(luò)query.validate表單驗(yàn)證的話，是不是感覺(jué)有點(diǎn)怪怪的呢？

因?yàn)槲覀兌贾纉query.validate的格式是需要通過(guò)選擇器（selector）選擇要驗(yàn)證的表單的form ID。然而在內(nèi)容頁(yè)里我們貌似看不到對(duì)應(yīng)的form id，因?yàn)樗谀赴骓?yè)里了，不知道有沒(méi)有朋友像我這樣想？

如果是在以前未用母版頁(yè)的時(shí)候，若有多個(gè)表單，我們可以根據(jù)不同的表單ID進(jìn)行以下操作

$(document).ready(function ({
$("#form1的id").validate();
$("#form2的id").validate();
$("#form3的id").validate();
})

但是現(xiàn)在用了母版頁(yè)，根據(jù)上面的 html中的內(nèi)容，我們只能寫(xiě)成

$(document).ready(function ({
$("#form1").validate();
})

大家可能會(huì)想，如果這樣寫(xiě)的話，是不是就要把jquery的代碼移到母版頁(yè)的<head>中呢？這樣的話它才能覆蓋到所有內(nèi)容頁(yè)的html??？但是又感覺(jué)這一個(gè)validate管的事情好多??？它能分清不同內(nèi)容頁(yè)中的所要驗(yàn)證的控件嗎？

這個(gè)問(wèn)題在這里我給大家解釋一下，

是這樣的，我們可以想一下，當(dāng)我們運(yùn)行程序的時(shí)候，在我們要驗(yàn)證控件的頁(yè)面，點(diǎn)擊鼠標(biāo)右鍵，查看源代碼，我們會(huì)發(fā)現(xiàn)母版頁(yè)的內(nèi)容和內(nèi)容頁(yè)內(nèi)容連接的很好，而且我們可以看到這個(gè)頁(yè)面的form id，所以大家就可以想想，其實(shí)上面的顧慮是多余的，jquery本身就是一個(gè)前臺(tái)技術(shù)，是js 的衍生品，所以它是關(guān)注你前臺(tái)的事情，而使用母版頁(yè)的時(shí)候，在運(yùn)行后，母版頁(yè)和內(nèi)容頁(yè)就是一個(gè)獨(dú)立的頁(yè)，而這時(shí)，我們只要在當(dāng)前的內(nèi)容頁(yè)的<head>中插入對(duì)內(nèi)容頁(yè)控件驗(yàn)證的jquery.validate代碼就行。所以上面的顧慮是多余的。

就算是使用母版頁(yè)，我們還是一樣可以用以前的思想，在各自的內(nèi)容頁(yè)里面加jquery.validate。

說(shuō)了這么多，其實(shí)還沒(méi)有講到這跟visual studio 2005有何關(guān)系？

其實(shí)是這樣的，在visual studio 2005里關(guān)于母版頁(yè)有這樣的問(wèn)題，就像是GridView，Reapter等控件一樣，只要包含在其中，運(yùn)行的時(shí)候被包含的控件ID前面就會(huì)加上一個(gè)前綴，類似ctl100_這樣的東西，大家應(yīng)該都知道，所以以前遇到這樣的事情的時(shí)候，寫(xiě)前臺(tái)代碼取控件ID，都會(huì)默認(rèn)加上這個(gè)前綴，但是這樣很不好，如果母版頁(yè)有改動(dòng)，真是牽一發(fā)而動(dòng)全身，改動(dòng)量非常大。

今天了解到了一個(gè)方法個(gè)人覺(jué)得是非常好的，就是像如下這樣寫(xiě)

$(document).ready(function ({
$("#<%= form1.ClientID %>").validate();
})

這個(gè)方法也同樣適用于控件，就是可以直接找到它運(yùn)行時(shí)的前臺(tái)真正ID。

例如：

function InitRules() {
    opts = {
         rules:
         {
                <%=txtUid.UniqueID %>:
                {
                    required: true
                },
                <%=txtPwd.UniqueID %>:
                {
                    required: true,
                    minlength: 6
                },
                <%=txtRePwd.UniqueID %>:
                {
                    required: true,
                    minlength: 6,
                    equalTo:"#<%=txtPwd.ClientID %>"
                },
                <%=txtName.UniqueID %>:
                {
                    required: true
                },
                <%=txtAge.UniqueID %>:
                {
                    required: true,
                    number: true,
                    range: [1,99]
                },
                <%=txtEmail.UniqueID %>:
                {
                    email: true
                }
         },
         messages:
         {
                <%=txtPwd.UniqueID %>:
                {
                    required:"不輸入用戶名你怎么登陸?"
                },
                <%=txtPwd.UniqueID %>:
                {
                    required:"你不輸入密碼怎么行呢?",
                    minlength:"密碼太短啦至少6位"
                },
                <%=txtAge.UniqueID %>:
                {
                    range:"您的年齡有問(wèn)題把,得在1-99歲之間哦"
                }
         }
    }
}

但是這里我要說(shuō)明一下，如果要是對(duì)表單ID使用$("#<%= form1.ClientID %>")方法獲取ID，那么這個(gè)$("#<%= form1.ClientID %>").validate();就必須放入母版頁(yè)的body中，具體為什么要這樣做，我還沒(méi)有深究，希望明白的朋友能留言解答一下。

另外還有一點(diǎn)是在visual studio 2005中，母版頁(yè)的默認(rèn)form id是form1，如果你不去改動(dòng)的話，運(yùn)行之后這個(gè)form1變成 aspnetForm，所以你會(huì)看到很多時(shí)候有人這樣寫(xiě)也就不奇怪了

$(document).ready(function ({
$("#aspnetForm").validate();
})

下面再說(shuō)visual studio 2010里的母版頁(yè)

微軟可能在這個(gè)版本已經(jīng)更人性化了，它不會(huì)再自動(dòng)變成aspnetForm，所以就正常使用就行。

如果是在內(nèi)容頁(yè)的<head>中去加驗(yàn)證，就要寫(xiě)成

$(document).ready(function ({
$("#form1").validate();
})

注意，這里是直接用母版頁(yè)中的form id就可以

當(dāng)然如果你想使用ID.ClientID這種形式的話，就必須把

$(document).ready(function ({
$("#<%= form1.ClientID %>").validate();
})

這段代碼加入到母版頁(yè)的<body>中

最后總結(jié)一下，無(wú)論在visual studio什么版本下，記住兩點(diǎn)，那么用jquery.validate就不會(huì)有問(wèn)題。

1、如果每個(gè)表單的驗(yàn)證代碼都在對(duì)應(yīng)的內(nèi)容頁(yè)的<head>中去寫(xiě)，那么選取的form id要寫(xiě)其實(shí)際運(yùn)行時(shí)顯示的ID。

2、如果驗(yàn)證代碼寫(xiě)在母版頁(yè)中，那么最好使用<%= ID.ClientID %> 方法取表單所要驗(yàn)證控件的ID，并且將其寫(xiě)入<body>中。

關(guān)于這個(gè)問(wèn)題如果大家還有其它情況的錯(cuò)誤都可以聯(lián)系我，我們一起探討。

文章名稱：Asp.net母版頁(yè)情況下如何進(jìn)行jquery.validate驗(yàn)證
本文鏈接：http://chinadenli.net/article6/ppgdog.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁(yè)設(shè)計(jì)公司、外貿(mào)網(wǎng)站建設(shè)、外貿(mào)建站、網(wǎng)站設(shè)計(jì)公司、移動(dòng)網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

Asp.net母版頁(yè)情況下如何進(jìn)行jquery.validate驗(yàn)證