asp: RequiredFieldValidator does not work with ajaxtoolkit: ModalPopupExtender

1

I mean, I'm combining these two controls in ASP.net, the idea is that PopUp is not visible until several TextBox are filled, the problem is that I'm not respecting this validation and PopUp shows me independently that the field is empty, then attach the code:

div class="panel-body">
            Name:
            <asp:TextBox ID="txtName" runat="server" ValidationGroup="e"/>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator_txtMiles" ControlToValidate="txtName" EnableClientScript="true" 
            Display="Dynamic" SetFocusOnError="true" Text="Miles is a required field" Enabled="true" runat="server" ValidationGroup="e">
            </asp:RequiredFieldValidator>
            <br />

            <br />
            <asp:Button ID="btnDisplayName" runat="server" Text="Display Name" CausesValidation="false"
                OnClientClick="return DisplayName()" ValidationGroup="e"/>
            <asp:LinkButton ID="lnkDummy" runat="server"></asp:LinkButton>
            <ajaxtoolkit:ModalPopupExtender ID="ModalPopupExtender1" BehaviorID="mpe" runat="server"
                PopupControlID="pnlPopup" TargetControlID="lnkDummy" BackgroundCssClass="modalBackground">
            </ajaxtoolkit:ModalPopupExtender>
            <asp:Panel ID="pnlPopup" runat="server" CssClass="modalPopup" Style="display: none">
                <div class="header">
                    Modal Popup
                </div>
                <div class="body">
                Your name: <span id="lblName"></span>
                <br />
                <asp:Button ID="btnClose" runat="server" Text="Close" OnClientClick="return HideModalPopup()" />
            </div>
            </asp:Panel>
        </div>

<script type="text/javascript">
        function DisplayName() {
            console.log(Page_ClientValidate());
            if (Page_ClientValidate()) {
                $get("lblName").innerHTML = $get("<%=txtName.ClientID %>").value;
                $find("mpe").show();
            }
            return false;
        }
        function HideModalPopup() {
            $find("mpe").hide();
            return false;
        }
    </script>
    
asked by IngErick 18.04.2017 в 18:22
source

0 answers