locked
How to use CustomValidator on ModalPopupExtender RRS feed

  • Question

  • User-1063667917 posted

    Hi,

    I am using a ModalPopupExtender, in this modal the user saves an email, but I need to validate that the email does not exists to avoid duplicates.

    I can't allow the page to postback because the modal will hide, so I need a sample to do it async.

    I've seen lots of samples of CustomValidator but not on a ModalPopupExtender or not checking database.

    So far I have done this but it's not working:

    AJAX:

    function validateEmail(oSrc, args) {
            var isValid;
            if (args.Value == '' || args.Value == undefined || $('#<%= txtRFCc.ClientID%>').val() == '') {
                    // prevent from calling webservice when unnecessary
                    isValid = true;
                    args.IsValid = true;
            }
            else {
                    $.ajax({
                            type: "POST",
                            url: "invoice33.aspx/IsUserAvailable",
                            contentType: "application/json; charset=utf-8",
                            data: "{ 'username':  '" + args.Value + "'," + $('#<%= IdC.ClientID%>').val() + "}",
                            dataType: "json",
                            async: false,
                            success: function (msg) {
                                    isValid = msg.d;
                            }
                            //, error: function () { }
                    });
            }
            args.IsValid = isValid;
            console.log('args.IsValid: ' + args.IsValid);
            console.log('isValid: ' + isValid);
    }

    ASP:

    <asp:CustomValidator ClientValidationFunction="validateEmail" runat="server" ID="rfcc" ForeColor="Red" Font-Bold="true" ErrorMessage="Already exists" ControlToValidate="txtRFCc" Display="Dynamic" ValidationGroup="nSave" />

    Code behind:

     <WebMethod()> _
        Public Shared Function IsUserAvailable(ByVal username As String, ide As Int32) As Boolean
            Dim sls As New Intra.Clients
            If sls.ClientExists(ide, username) Then
                Return True
            Else
                Return False
            End If
        End Function

    Any hint?


    Thanks in advance

    Tuesday, July 25, 2017 5:13 PM

Answers

  • User-707554951 posted

    Hi GeorgeClass,

    Simple working example as below :

     <style type="text/css">
            .modalBackground {
                background-color: Black;
                filter: alpha(opacity=90);
                opacity: 0.8;
            }
    
            .modalPopup {
                background-color: #FFFFFF;
                border-width: 3px;
                border-style: solid;
                border-color: black;
                padding-top: 10px;
                padding-left: 10px;
                width: 300px;
                height: 140px;
            }
        </style>
     <script>
            function ClientValidate(source, arguments) {
                if (arguments.Value % 2 == 0) {
                    arguments.IsValid = true;
                } else {
                    arguments.IsValid = false;
                }
            }
        </script>
    
     <div>
                <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
                <asp:Button ID="btnShow" runat="server" Text="Show Modal Popup" />
                <!-- ModalPopupExtender -->
                <ajaxToolkit:ModalPopupExtender ID="mp1" runat="server" PopupControlID="Panel1" TargetControlID="btnShow"
                    CancelControlID="btnClose" BackgroundCssClass="modalBackground">
                </ajaxToolkit:ModalPopupExtender>
                <asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" align="center" Style="display: none">
                    This is an ASP.Net AJAX ModalPopupExtender Example<br />
                     <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                   <asp:Label id="Message"  
               Text="Enter an even number:" 
               Font-Name="Verdana" 
               Font-Size="10pt" 
               runat="server"/>
                <asp:TextBox ID="Text1"
                    runat="server" />             
                     <asp:CustomValidator ID="CustomValidator1"
              ControlToValidate="Text1"
              ClientValidationFunction="ClientValidate"     
              Display="Static"
              ErrorMessage="Not an even number!"
              ForeColor="green"
              Font-Name="verdana"
              Font-Size="10pt"
              runat="server" />
                    </ContentTemplate>
            </asp:UpdatePanel>
                    <asp:Button ID="btnClose" runat="server" Text="Close" />
                </asp:Panel>
                
         
            </div>

    Output:

    Related link:

    https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.customvalidator.clientvalidationfunction(v=vs.110).aspx#Examples

    Best regards

    Cathy

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, July 26, 2017 9:47 AM