asp.net隐藏时不验证Modal表单

时间:2015-08-09 19:58:42

标签: asp.net validation bootstrap-modal

我有一个模态表单(bootstrap),我使用asp.net RequiredFieldValidtors进行数据输入验证。此验证只应在模态可见时触发,并且用户在模式中输入新值。

我遇到的问题是,当未显示模型表单阻止我的主页接受新数据输入时,验证会触发。我的模态仅用于添加新值,而不是我主页上正常工作流程的一部分。

我已经被困在这两天了,并尝试了许多不同的事情,但是无法理解它。

有关如何在保持RequiredFieldValidator规则不变的情况下处理此问题的任何建议吗?

由于

编辑 - 添加模态表单代码。

<asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
    <ContentTemplate>
        <div class="modal fade" id="modNewStakeholder" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-sm">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title">Add Stakeholder</h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <label class="control-label">First Name:</label>
                            <asp:TextBox class="form-control focus" ID="tFirstName" runat="server" AutoComplete="off" placeholder="First name is required"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="rftFirstName"
                                runat="server" ErrorMessage="Required Field"
                                ControlToValidate="tFirstName" Display="Dynamic"
                                ValidationGroup="ValGroupNewStake"></asp:RequiredFieldValidator>
                        </div>
                        <div class="form-group">
                            <label class="control-label">Last Name:</label>
                            <asp:TextBox class="form-control" ID="tLastName" runat="server" AutoComplete="off" placeholder="Last name is required"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="rftLastName"
                               runat="server" ErrorMessage="Required Field" ControlToValidate="tLastName" Display="Dynamic"
                               ValidationGroup="ValGroupNewStake"></asp:RequiredFieldValidator>
                        </div>
                        <div class="form-group">
                            <label class="control-label">E-Mail:</label>
                            <asp:TextBox class="form-control" ID="tEmail" runat="server" AutoComplete="off" placeholder="Email must contain @expeditors.com"></asp:TextBox>
                            <asp:RequiredFieldValidator ID="rftEmail" runat="server" ControlToValidate="tEmail" Display="Dynamic"
                                ValidationGroup="ValGroupNewStake"
                                ErrorMessage="Required Field">
                            </asp:RequiredFieldValidator>

                            <asp:RegularExpressionValidator ID="rftEmailAt" runat="server" ControlToValidate="tEmail" Display="Dynamic"
                                ErrorMessage="Invalid Email, must contain @"
                                ValidationGroup="ValGroupNewStake"
                                ValidationExpression="^\w+[\w-\.]*\@\w+((-\w+)|(\w*))\.[a-z]{2,3}$">
                            </asp:RegularExpressionValidator>

                            <asp:RegularExpressionValidator ID="rftEmailDomaain" runat="server" ControlToValidate="tEmail" Display="Dynamic"
                                ErrorMessage="Invalid Email, must be an @abc.com domain"
                                ValidationGroup="ValGroupNewStake"
                                ValidationExpression="^.+@[Aa][Bb][Cc][.][Cc][Oo][Mm]$">
                            </asp:RegularExpressionValidator>

                        </div>
                    </div>
                    <div class="modal-footer">
                        <div class="btn-group" role="group" aria-label="...">
                            <button type="button" class="btn btn-success btn-sm" id="cmdOk_AddSholder" runat="server" onserverclick="cmdOk_AddSholder_ServerClick" ValidationGroup="ValGroupNewStake" causesvalidation="false">Ok</button>
                            <button type="button" class="btn btn-danger btn-sm" id="cmdCancel_AddSholder" runat="server" data-dismiss="modal" onserverclick="cmdCancel_AddSholder_ServerClick">Cancel</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="cmdOk_AddSholder" EventName="serverclick" />
    </Triggers>
</asp:UpdatePanel>

1 个答案:

答案 0 :(得分:1)

我已经汇总了一个非常简单的示例,说明了我的应用程序是如何做到这一点的。 Modal只是一个ascx控件,有一个updatepanel。它实际上只是一个控件变得可见但我们使用CSS和JavaScript使它成为一个模态。同样的逻辑应该仍然适用,因为我已经从一个有效的模态中制作了这个样本。

<强> Modal.ascx

验证器具有ValidationGroup并被禁用。按钮也分配给ValidationGroup:

<div id="approvalModal" style="display: none;">
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" Enabled="false"
        ControlToValidate="TextBox1" ValidationGroup="testValidationgGroup" ErrorMessage="RequiredFieldValidator"></asp:RequiredFieldValidator>
    <asp:Button ID="Button1" runat="server" Text="Button" ValidationGroup="testValidationgGroup" />
</div>

<强> Modal.ascx.vb

在属性中启用验证器:

Partial Class Modal
    Inherits System.Web.UI.UserControl

    Public WriteOnly Property Enable() As Boolean
        Set(value As Boolean)
            RequiredFieldValidator1.Enabled = value
        End Set
    End Property

End Class

PageWithModal.aspx (注意:使用jQuery)

<script>
    function setupTestModal() {
        var modal = $('#approvalModal');
        if (modal.css('display') == 'none') {
            modal.show();
        }
    }
</script>

<asp:Button ID="ShowModal" runat="server" Text="Show Modal" OnClick="ShowModal_Click" />
<uc1:Modal runat="server" ID="testModal" />

<强> PageWithModal.aspx.vb

请注意,单击ShowModal按钮时,验证不会触发。但是,当模态可见时,验证器已启用。

Protected Sub ShowModal_Click(sender As Object, e As EventArgs)
    testModal.Enable = True
    Dim script = String.Concat("setupTestModal();")
    ScriptManager.RegisterStartupScript(Me.Page, Me.Page.GetType(), "Popup", script, True)
End Sub
相关问题