Asp.net Page_ClientValidateの適用とスキップ

19860 ワード

実はネットで言われている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#のコードは無視しましょう.
一般的なasp:ButtonのCausesValidationプロパティは、コミット前にカスタマーサービス側の検証を行うかどうかを制御します.ここのbtnCancelボタンはカスタマーサービス側の検証は行わないはずですが、検証が通らなくてもpostリクエストを開始できるでしょう.CausesValidationのプロパティは何なのか、生成されたHTMLコードを見てみましょう.
 <input type="submit" name="btnAdd" value="Add" onclick="return ValidationFees();WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;btnAdd&quot;, &quot;&quot;, true, &quot;&quot;, &quot;&quot;, 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の検証.私が以前自分でコードしていたとき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", ""); テスト後、サービス側関数がトリガーされることがわかりました.プロジェクトの時間が比較的に緊張しているため、私は具体的な原因を見つけていません.実際のプロジェクトはこれよりも複雑で、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はここではsubmitのボタンではなく普通のbuttonである).
したがって、一般的なボタンをコミットする前にPage_を実行する必要があります.ClientValidate関数は、カスタマーサービス側がPageを呼び出すのではなく、CausesValidation=trueを設定することを推奨します.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");
}
等価です.