无法使用 c#asp.net 验证空输入字段

Question

我无法使用 c# asp.net 验证空输入字段。其实我有两个输入字段。我需要显示空白输入字段的验证消息。我做了一些编码。当我在不提供任何输入的情况下单击提交按钮时，我收到第一个输入字段 i.e., Name field can not be blank 的错误消息，并且该输入字段上有一个红色边框。当我向第一个输入字段提供任何输入并再次单击提交按钮时，第二个输入字段的错误消息即将到来，但问题是边框颜色在第一个输入字段中显示为红色，这不应该出现。我在下面解释我的代码。

index.aspx:

<div class="widget-title">Doctor Registration <span id="validationMessage" runat="server" ></span></div>
<div class="row doctorlist-form">
    <div class="col-md-6 bmargindiv1">
        <label for="doctorname" accesskey="N"><span class="required">*</span> Name</label>
        <div class="col-md-2 padding-zero">
        <asp:DropDownList ID="txtdoctorprefix" name="doctorname" runat="server">
        <asp:ListItem Value="Dr." Selected="True" Text="Dr."></asp:ListItem>
        <asp:ListItem Value="Mr." Text="Mr."></asp:ListItem>
        <asp:ListItem Value="Mrs." Text="Mrs."></asp:ListItem>
        </asp:DropDownList>
        </div>
        <div class="col-md-10 padding-zero"><asp:TextBox ID="txtDoctorName" runat="server" oninput="detectName('dName');" ></asp:TextBox></div>
        <div class="clearfix"></div>
    </div>
    <div class="col-md-6 bmargindiv1">
        <label for="gender" accesskey="G"><span class="required">*</span> Gender</label>
        <asp:DropDownList ID="txtGender" name="grnder" runat="server" onchange="selectGender('gender');">
        <asp:ListItem Text="Select your Gender" Selected="True"></asp:ListItem>
        <asp:ListItem Text="Male" Value="male" ></asp:ListItem>
        <asp:ListItem Text="Female" Value="female"></asp:ListItem>
        </asp:DropDownList>
    </div>
    <div class="col-md-12 bmargindiv1">
        <asp:Button runat="server" Text="Submit" class="button" ID="doctorDetails" OnClick="doctorDetails_Click" />
    </div>
</div>
<script type="text/javascript">
    function detectName(nameid) {
         var type = nameid;
         console.log(type);
         switch (type) {
             case 'dName':
                 $('#<%=txtDoctorName.ClientID %>').css('border-color', '#e3e3e3');
                 $('#<%=validationMessage.ClientID %>').empty();
                 break;
         }
     }
     function selectGender(type) {
         var type = type;
         switch (type) {
             case 'gender':
                 $('#<%=txtGender.ClientID %>').css('border-color', '#e3e3e3');
                 $('#<%=validationMessage.ClientID %>').empty();
                 break;
         }
     }
</script>

index.aspx.cs:

protected void doctorDetails_Click(object sender, EventArgs e)
{
   // Response.Write(txtDoctorName.Text.Trim().Length);
    if (txtDoctorName.Text.Trim().Length == 0 )
    {
        validationMessage.InnerText = "Name field can not be blank.";
        validationMessage.Style.Add("color", "red");
        txtDoctorName.Focus();
        txtDoctorName.BorderColor = System.Drawing.Color.Red;
        return;
    }
    if (txtGender.SelectedIndex==0)
    {
        validationMessage.InnerText = "Gender field can not be blank.";
        validationMessage.Style.Add("color", "red");
        txtGender.Focus();
        txtGender.BorderColor = System.Drawing.Color.Red;
        return;
    }
}

我的问题是当总字段为空白并且我单击提交按钮时，错误消息正确出现，但同时当我向第一个文本字段提供一些输入并再次单击提交按钮时，第一个 if 语句是也与不应该发生的第二个 if 语句一起执行。在这种情况下，只有第二个 if 语句应该执行。请帮我解决这个问题。

Answer 1

我强烈建议使用 ASP.NET 验证控件。例如：

ASPX 页面

<asp:ValidationSummary ID="vs" runat="server" ValidationGroup="Default" />

<asp:TextBox ID="txtDoctorName" runat="server" />

<asp:CustomValidator 
    ID="cv" 
    runat="server" 
    ControlToValidate="txtDoctorName"
    ValidateEmptyText="true"
    Text="*" 
    OnServerValidate="ValidateRequired"
    ErrorMessage="Please enter a valid Doctor Name."
    ValidationGroup="Default" />

代码背后

protected void SubmitOnClick(object sender, EventArgs e)
{
    if (!Page.IsValid) return;
    ...
}

protected void ValidateRequired(object source, ServerValidateEventArgs args)
{
    args.IsValid = !string.IsNullOrEmpty(args.Value.Trim());
}

ValidationSummary 将为您提供所有验证错误的一个很好的列表，而不是一次一个。

如果您要继续使用此方法，要修复第一个文本框上的红色边框不会消失，您需要在每次单击按钮时重置边框颜色：

protected void doctorDetails_Click(object sender, EventArgs e)
{
    // Clear all properties each time the button is clicked
    validationMessage.InnerText = string.Empty;
    txtDoctorName.BorderColor = System.Drawing.Color.Black;
    txtGender.BorderColor = System.Drawing.Color.Black;

    if (txtDoctorName.Text.Trim().Length == 0 )
    {
    ...
}

您可以在调试模式 (F5) 下启动您的项目，在 doctorDetails_Click 方法上放置一个断点，然后使用 F10 逐步查看正在发生的事情的更多详细信息。

Answer 2

由于您在服务器 (runat) 上运行的控件上明确设置了边框的颜色 - 我强烈的预感是 ViewState 保留了这些属性。

您可以通过反转代码以在第一个输入之前检查第二个输入来测试该行为，您可能会看到红色边框现在保留在第二个上，而（仅）第一个验证失败

我同意@GoatBreeder 你使用buitin validation controls，