javascript - ajax ModalPopupExtender 显示页面是否无效

问题描述

我正在使用 Ajax Modal 弹出扩展器在回发进行时阻止 UI。即使页面无效，即即使缺少一些必填字段值，此模式弹出窗口也会显示，模式弹出窗口总是会出现。我不希望模式弹出显示页面是否无效下面是代码：

<script>
      function showProgress() {
            
            if (typeof (Page_ClientValidate) == 'function') {
                Page_ClientValidate();
            }

            if (Page_IsValid) {
                $find('mdlPopup').show();
            }

       
    }
</script>

在我的表单中，我有以下代码：

 <form id="form1" runat="server">
        <asp:ScriptManager ID="srcMan" runat="server"></asp:ScriptManager>
        <div>
             <asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>
            <asp:Button runat="server" Text="Send" CssClass="input-button"
                OnClick="btn_Click" Width="167px" OnClientClick="showProgress();" />
            <ajaxToolkit:ModalPopupExtender ID="mdlPopup" runat="server" TargetControlID="pnlPopup"
                PopupControlID="pnlPopup" BackgroundCssClass="modalBackground" />
    <asp:Panel ID="pnlPopup" runat="server" CssClass="updateProgress">
        <div id="imageDiv">
            <div style="float: left; margin: 9px">
                <img src="loader.gif" width="32px" height="32px" /></div>
            <div style="padding-top: 17.5px; font-family: Arial,Helvetica,sans-serif; font-size: 12px;">
               Please wait...
            </div>
        </div>
    </asp:Panel>

        </div>
    </form>

我的页面上有以下必需的验证器：

<asp:RequiredFieldValidator Display="None"  ID="Validator1" runat="server" ErrorMessage="First Name is required" ControlToValidate="txtFirstName"></asp:RequiredFieldValidator>

当我单击发送按钮时，即使名字文本框没有填充值，我也会看到 modalpopup。他们有什么办法吗，如果页面无效，我可以阻止 modalpop 执行。下面是发送按钮内的代码：

protected  void btn_Click(object sender, System.EventArgs e)
    {
        if (Page.IsValid)
        {
           // my code here
        }
    }

以下是我的完整代码：

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

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function showProgress() {
            if (Page_ClientValidate("Validate")) {
                $find('mdlPopup').show();
            }

       
    }
    </script>

      
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="srcMan" runat="server"></asp:ScriptManager>
        <div>
            <asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>
            <asp:Button runat="server" ID="Button2" Text="Send" CssClass="input-button"
                OnClick="btn_Click" Width="167px" OnClientClick="showProgress();" />
            <ajaxToolkit:ModalPopupExtender ID="mdlPopup" runat="server" TargetControlID="pnlPopup"
                PopupControlID="pnlPopup" BackgroundCssClass="modalBackground" />
    <asp:Panel ID="pnlPopup" runat="server" CssClass="updateProgress">
        <div id="imageDiv">
            <div style="float: left; margin: 9px">
                <img src="loader.gif" width="32px" height="32px" /></div>
            <div style="padding-top: 17.5px; font-family: Arial,Helvetica,sans-serif; font-size: 12px;">
                Sending file. Please wait...
            </div>
        </div>
    </asp:Panel>

        </div>
        <asp:RequiredFieldValidator Display="Dynamic" ValidationGroup="Validate"  ID="Validator1" runat="server" ErrorMessage="First Name is required" ControlToValidate="txtFirstName"></asp:RequiredFieldValidator>

    </form>
</body>
</html>

下面是我背后的代码：

 protected void btn_Click(object sender, EventArgs e)
        {

            System.Threading.Thread.Sleep(1000);
        }

下面是我运行代码时浏览器的图像。如您所见，未填写 txtFirstName 文本框。不过，我可以看到 modalPopup：

标签： javascriptc#jqueryasp.netajax

javascript - ajax ModalPopupExtender 显示页面是否无效

问题描述

解决方案

推荐阅读