1

我有以下登录表单，我正在使用Block UI在服务器端验证进行时阻止登录表单，并且由于更新面板，在刷新更新面板后，此阻止 ui 再次取消阻止登录表单：

登录表单：

<h1>User Login</h1>
<asp:Label ID="lblErrorCredentials" runat="server" ForeColor="Red"></asp:Label>
<label class="grey" for="log">Email ID:</label>


<asp:TextBox ID="txtCustEmailID" runat="server" CssClass="field"></asp:TextBox>

<asp:RequiredFieldValidator ID="rfvCustEmailID" runat="server" Font-Bold="False"
Font-Size="Small" ForeColor="Red" ErrorMessage="Please Enter Valid EmailId."
ControlToValidate="txtCustEmailID" SetFocusOnError="True"Text="*">
</asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="revCustEmailID" runat="server"
ControlToValidate="txtCustEmailID" ErrorMessage="Invalid Email ID" Font-Bold="False"
Font-Size="Small" ForeColor="Red"
ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">
</asp:RegularExpressionValidator>


<label class="grey">Password:</label>

<asp:TextBox ID="txtCustPwd" runat="server" CssClass="field"></asp:TextBox>

<asp:RequiredFieldValidator ID="rfvCustPwd" Font-Bold="False"Font-Size="Small" ForeColor="Red" runat="server" ErrorMessage="Please Enter Your Password."
ControlToValidate="txtCustPwd" SetFocusOnError="True" Text="*">
</asp:RequiredFieldValidator>

<asp:Button ID="btnCustLogin" runat="server" Text="Login" OnClick="btnCustLogin_Click"/>

在此处输入图像描述

这个块 ui 正在做什么它永久地阻止我的 div 仍然由于错误的输入而激活了验证器，并且用户无法再次重试日志记录。

以下是块 ui 的代码

阻止用户界面：

$(document).ready(function () {
    $('#btnCustLogin').click(function () {
        $('div#LoginForm').block({

            message: '<h4>Processing</h4>',
            css: { border: '3px solid #35a7c1' }
        });

    });

});

现在我想要的是，每当我的 asp 验证器被激活时，这个块 ui 应该被禁用。请帮帮我。

4

1 回答 1

1

我使用简单的 javascript isValid 属性找到了解决方案

我正在做的是检查所有验证器的有效性，如果所有验证器都正确并通过，那么只有我调用 block ui 来阻止登录表单，如下所示：`

$(document).ready(function () {
    $('#btnCustLogin').click(function () {
        if (document.getElementById("rfvCustEmailID").isvalid && document.getElementById("revCustEmailID").isvalid && document.getElementById("rfvCustPwd").isvalid) {
        $('div#LoginForm').block({

            message: '<h3><img src="Images/Loading_Smaller.gif"/> Processing...</h3>',
            css: {
                    border: '3px solid #35a7c1',
                    width: '200px'


                }           

            });

        }

    });

});

现在登录表单只有在所有验证器都通过时才会阻塞，并且在服务器端验证完成和更新面板更新之前保持阻塞状态。

于 2013-07-30T08:14:04.480 回答