我无法使用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语句。请帮我解决这个问题。
答案 0 :(得分: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查看有关正在进行的操作的详细信息。
答案 1 :(得分:0)
由于您在服务器(runat)上运行的控件上显式设置了边框的颜色 - 我强烈的预感是ViewState保留了这些特性。
您可以通过反转代码来检查第一个输入之前的第二个输入来测试该行为,您可能会看到红色边框现在保留在第二个输入上,而(仅)第一个输入验证失败
我同意@GoatBreeder你使用buitin validation controls,