ASP.NET 自定义验证器客户端和服务器端验证答案

【问题标题】：ASP.NET Custom Validator Client side & Server Side validationASP.NET 自定义验证器客户端和服务器端验证
【发布时间】：2017-05-03 23:23:13
【问题描述】：

在我的网页中，我尝试在客户端和服务器端进行验证。如果下拉菜单和文本框为空，我需要显示一条错误消息，但如果其中一个已填写，则验证应该通过。有没有办法为两个控件创建一个 CustomValidator ？我觉得我做得不对。

客户端代码：

 <div>
        <table>
            <tr>
                <td>
                 <asp:DropDownList ID="ddlStates" runat="server"  Width="128px">
                             <asp:ListItem></asp:ListItem>
                             <asp:ListItem>Nevada</asp:ListItem>
                             <asp:ListItem>Uta</asp:ListItem>
                             <asp:ListItem>Oregon</asp:ListItem>
                  </asp:DropDownList>
                </td>
                 <td>
                     <asp:CustomValidator ID="cvddlState" runat="server"
                     ClientValidationFunction="StatesCheck"
                     OnServerValidate="ServerValidation"
                     ErrorMessage="(*) State is required" ForeColor="Red"
                     Display="Dynamic"></asp:CustomValidator>
                </td>

            </tr>
            <tr>
                <td>
                    <asp:TextBox ID="txtStates" runat="server"></asp:TextBox>
                </td>
                <td>
                    <asp:CustomValidator ID="cvtxtStates" runat="server"
                     ValidateEmptyText="true"
                     ClientValidationFunction="StatesCheck"
                     OnServerValidate="ServerValidation"
                     ControlToValidate="txtStates"
                     ErrorMessage="(*) Text cannot be empty" ForeColor="Red"
                     Display="Dynamic"></asp:CustomValidator>
                </td>

            </tr>
            <tr>
                <td>
                      <asp:Button  ID="btnSubmit" runat="server" Text="Submit" />
                </td>
            </tr>
        </table>
    </div>

     <div id="divErrorMessage" runat="server" class="alert alert-danger" visible="false"></div>
 

<script type="text/javascript">

    'Use Strict';
    function StatesCheck(source, args) {
        var ddlStates = document.getElementById("<%=ddlStates.ClientID%>");
        var txt = document.getElementById('<%=txtStates.ClientID%>').value;
        var state = ddlStates.options[ddlStates.selectedIndex].value;

        if (ddlStates !== null) {
            if ((state === "") && (txt === "")) {
                args.IsValid = false;
            }
            else {
                args.IsValid = true;
            }
        }
    }

</script>

服务器端代码：

Public Sub btnSubmit_Click(sender As Object, e As EventArgs) Handles btnSubmit.Click
        Try
            divErrorMessage.Visible = False
            divErrorMessage.InnerText = ""


            Dim ddlSelection As String = ddlStates.SelectedItem.Text
            Dim statesText As String = txtStates.Text.Trim()
            If statesText = String.Empty And ddlSelection = String.Empty Then
            Else
                divErrorMessage.Visible = True
                divErrorMessage.InnerText = "(*) Text cannot be empty"
            End If

        Catch ex As Exception

        End Try
    End Sub

    Protected Sub ServerValidation(source As Object, args As ServerValidateEventArgs)
        If (ddlStates.SelectedItem.Text = String.Empty) And (txtStates.Text.Length = 0) Then
            args.IsValid = False
        Else
            args.IsValid = True
        End If

    End Sub

【问题讨论】：

标签： javascript asp.net .net vb.net validation

【解决方案1】：

您是否从服务器端和客户端的代码中都得到了答案？我要回答服务端

Protected Sub ServerValidation(source As Object, args As ServerValidateEventArgs)
        If (ddlStates.SelectedItem.Text = String.Empty) And (txtStates.Text.Length = 0) Then
            args.IsValid = False
        Else
            args.IsValid = True
        End If

    End Sub

根据我的经验，我在 ASP.net 中不太好，但根据上面的 ypur 代码，没有错，但是你说的部分 but if one of them is filled out the validation should pass 没有在这里显示，你可以试试这个。

 Protected Sub ServerValidation(source As Object, args As ServerValidateEventArgs)
            If (ddlStates.SelectedItem.Text = String.Empty) Or (txtStates.Text.Length = 0) Then
                args.IsValid = False
Else
                args.IsValid = True
            End If

        End Sub

或许

Protected Sub ServerValidation(source As Object, args As ServerValidateEventArgs)
        If (ddlStates.SelectedItem.Text = String.Empty) And (txtStates.Text.Length = 0) Then
            args.IsValid = False
        ElseIf (ddlStates.SelectedItem.Text <> String.Empty) then
          args.IsValid = True
        ElseIf (txtStates.Text <> "") then
          args.IsValid = True
        Else

            args.IsValid = True
        End If

    End Sub

【讨论】：

【解决方案2】：

这是一个 sn-p，您可以在其中使用 CustomValidator 评估两个控件

<asp:CustomValidator ID="CustomValidator1" runat="server" Display="Dynamic" ErrorMessage="input failed" ClientValidationFunction="myFunction"></asp:CustomValidator>

<script type="text/javascript">
    function myFunction(sender, element) {
        if (document.getElementById("<%= ddlStates.ClientID %>").selectedIndex == 0 && document.getElementById("<%= txtStates.ClientID %>").value != "") {
            element.IsValid = true;
        } else {
            element.IsValid = false;
        }
    }
</script>

【讨论】：

【解决方案3】：

您可以对上述场景使用客户端验证。

  <div>
        <table>
            <tr>
                <td>
                    <asp:DropDownList ID="ddlStates" runat="server" Width="128px">
                        <asp:ListItem></asp:ListItem>
                        <asp:ListItem>Nevada</asp:ListItem>
                        <asp:ListItem>Uta</asp:ListItem>
                        <asp:ListItem>Oregon</asp:ListItem>
                    </asp:DropDownList>
                </td>

            </tr>
            <tr>
                <td>
                    <asp:TextBox ID="txtStates" runat="server"></asp:TextBox>
                </td>


            </tr>
            <tr>
                <td>
                    <label id="lbltxtstate" style="display: none;">Please select a state or enter a state.</label>
                    <br />
                    <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick="return validateState();" />
                </td>
            </tr>
        </table>
    </div>

    <script type="text/javascript">
    function validateState(){
            if (($('#<%=ddlStates.ClientID %> option:selected').text() == "") && ($('#<%=txtStates.ClientID %>').val() == "")) {

            $('#lbltxtstate').attr('style', 'display:block');
            $('#lbltxtstate').attr('style', 'color:red');
            return false;
        }
        else {           
               $('#lbltxtstate').attr('style', 'display:none');
               return true;
        };

    }
    </script>

【讨论】：