您的位置:首页 > 编程语言 > ASP

Asp.net Page_ClientValidate 的应用和跳过

2015-09-22 12:51 711 查看
其实网上说道的Page_ClientValidate的博客其实有很多。这里就不列举了,最近在开发遇到一个问题给大家分享一下, 整理后的代码 如下:

HTML code,

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ClientValid.aspx.cs" Inherits="WebApp.ClientValid" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

<title></title>
<script type="text/javascript" src="js/jquery.1.83.min.js"></script>
<script type="text/javascript">
function ValidationFees() {
var btnAdd = $("#btnAdd");
Page_ClientValidate();
if (Page_IsValid) {
btnAdd.attr("disabled", "disabled");
__doPostBack("btnAdd", "");
return true;
}
}

function CancelFinancial() {
Page_ClientValidate();
$("#btnCancel").attr("disabled", "disabled");
__doPostBack("btnCancel", "");
return true;
}

</script>
</head>
<body>

<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div>

<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="rfvName" runat="server" ErrorMessage="name is required" ControlToValidate="txtName"></asp:RequiredFieldValidator>
<asp:Label ID="labMsg" runat="server" Text=""></asp:Label>
<br />
<asp:Button ID="btnAdd" runat="server" UseSubmitBehavior="false"  OnClientClick="return ValidationFees();" Text="Add" CssClass="button"
onclick="btnAdd_Click" />
<asp:Button ID="btnCancel" runat="server" OnClientClick="return CancelFinancial();"  Text="Cancel" CausesValidation="false" CssClass="button"
onclick="btnCancel_Click" />
</div>
<%--        <script type="text/javascript">
function WebForm_OnSubmit() {
// if (typeof (ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) return false;
return true;
}
</script>--%>
</form>
</body>
</html>


 

C#的code 就忽略它吧。

一般asp:Button 的CausesValidation属性就是控制 在提交前是否进行客服端验证。这里的btnCancel按钮应该不进行客服端验证,就算验证 没通过也是可以发起post请求的啊。CausesValidation属性究竟是什么了,让我们看看生成的HTML code,

<input type="submit" name="btnAdd" value="Add" onclick="return ValidationFees();WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("btnAdd", "", true, "", "", false, false))" id="btnAdd" class="button" />
<input type="submit" name="btnCancel" value="Cancel" onclick="return CancelFinancial();" id="btnCancel" class="button" />
</div>


CausesValidation为true的时候会有WebForm_DoPostBackWithOptions客户端function实现验证。我以前自己code的时候CancelFinancial函数一般如下,
function CancelFinancial() {
$("#btnCancel").attr("disabled", "disabled");
__doPostBack("btnCancel", "");
return true;
}
这样btnCancel的服务端 函数一定执行,但是增加了Page_ClientValidate()过后,btnCancel的服务端 函数还执行吗?我这边测试出来 是不执行的。那我们把函数改为如下:


function CancelFinancial() { 

Page_ClientValidate();

__doPostBack("btnCancel", "");

return true;

}

这样保留   Page_ClientValidate(); 而删除__doPostBack("btnCancel", ""); 测试后发现服务端 函数 触发。由于项目时间比较紧张当时我没有找到具体原因,真实项目比这个的demo复杂,发现移除 Page_ClientValidate();或者$("#btnCancel").attr("disabled",
"disabled");还是没有在验证不过的情况下触发服务器端函数。于是解决方案就是修改WebForm_OnSubmit函数,

<script type="text/javascript">
function WebForm_OnSubmit() {
// if (typeof (ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) return false;
return true;
}
</script>


这样一来btnCancel的服务端函数就执行(在客户端验证没过的情况下),btnAdd在客户端验证没过是不会执行的(根据当前的js函数,主要是btnAdd在这里是一个普通的button而不是一个submit的按钮)。

所以一般情况按钮提交前需要执行Page_ClientValidate函数 建议设置CausesValidation=true,而不是客服端调用 Page_ClientValidate函数,如果需要调用该函数请不要把按钮设置为disabled状态。应为从目前code来看

Page_ClientValidate();

$("#btnCancel").attr("disabled", "disabled");

__doPostBack("btnCancel", "");



if(Page_ClientValidate())

{

$("#btnCancel").attr("disabled", "disabled");

__doPostBack("btnCancel", "");

}

else{

$("#btnCancel").attr("disabled", "disabled");

}

是等价的。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: