I have two text-box fields on the Registration page and I am trying to setup either-or type of validation. The validation should kick-in when both the fields are empty, saying you must enter either of A or B fields to be able to register.
I have used custom validator like below, in my code, but it doesn't seem to work. I am looking for a smart way to validate these 2 text-boxes. Server side validations part:when i tested it, the break point never hits the function. Can someone suggest a clean way of doing this.
Please note that for the other controls on the page I have required field validators, I cannot have one here because I should be able to set either or condition for these 2 textboxes.
<div class="form-group">
<asp:Label Text="" ID="lblSCGrantNumber" runat="server" AssociatedControlID="txtStateCommGrantNumber">
State Commission Number
</asp:Label>
<asp:TextBox ID="txtStateCommGrantNumber" runat="server" TextMode="SingleLine" placeholder="State Commission Grant Number" AutoCompleteType="None" class="form-control"></asp:TextBox>
<%-- <asp:RequiredFieldValidator Display="Dynamic" ID="rfStateCommGrantNumber" Text="Required" SetFocusOnError="true" CssClass="text-danger" ControlToValidate="txtStateCommGrantNumber" runat="server"></asp:RequiredFieldValidator>--%>
<asp:CustomValidator ID="stateCommissionGrants" runat="server" OnServerValidate="ServerValidation" OnClientValidate="Validate_textboxes" ControlToValidate="txtStateCommGrantNumber" ErrorMessage="One of the two fields is required" ValidateEmptyText="true"></asp:CustomValidator>
</div>
<div class="form-group">
<asp:Label Text="" ID="lblGrantNumber" runat="server" AssociatedControlID="txtStateCommGrantNumber">
Grant Number
</asp:Label>
<asp:TextBox ID="txtGrantNumber" runat="server" TextMode="SingleLine" placeholder="Grant Number" AutoCompleteType="None" class="form-control"></asp:TextBox>
<%--<asp:RequiredFieldValidator Display="Dynamic" ID="rfStateCommGrantNumber" Text="Required" SetFocusOnError="true" CssClass="text-danger" ControlToValidate="txtStateCommGrantNumber" runat="server"></asp:RequiredFieldValidator>--%>
<asp:CustomValidator ID="grants" runat="server" OnServerValidate="ServerValidation" OnClientValidate="Validate_textboxes" ControlToValidate="txtGrantNumber" ErrorMessage="One of the two is required" ValidateEmptyText="true"></asp:CustomValidator>
</div>
Client side code:
<script type="text/javascript">
(function Validate_textboxes(sender, args) {
var v = document.getElementById('<%=txtStateCommGrantNumber.ClientID%>').value;
var v = document.getElementById('<%=txtGrantNumber.ClientID%>').value;
if (v == '') {
args.IsValid = false;
}
else {
}
});
serverside code:
protected void ServerValidation(object source, ServerValidateEventArgs args)
{
args.IsValid = txtStateCommGrantNumber.Text.Trim().Length > 0 || txtGrantNumber.Text.Trim().Length > 0;
if (!args.IsValid)
{
CustomValidator customvalidator = new CustomValidator();
customvalidator.IsValid = false;
customvalidator.ErrorMessage = "TextBox1 and TexBox2 can't both be empty";
Page.Form.Controls.Add(customvalidator);
}
}
You have to use ClientValidationFunction
attribute of CustomValidator
control. And within javascript function you have to set args.IsValid
property to true or false. For example:
<asp:Textbox id="text1" runat="server" text=""></asp:Textbox>
<asp:Textbox id="text2" runat="server" text=""></asp:Textbox>
<asp:CustomValidator id="CustomValidator1" runat="server"
ControlToValidate = "text1"
ErrorMessage = "Required"
ClientValidationFunction="validate" >
</asp:CustomValidator>
And Javascript:
<script type="text/javascript">
function validate(oSrc, args){
var v1 = document.getElementById('<%=text1.ClientID%>').value;
var v2 = document.getElementById('<%=text2.ClientID%>').value;
if (v1 == '' && v2 == '') {
args.IsValid = false;
}
else {
args.IsValid = true;
}
}
</script>
Edit: If the textbox is empty it might not trigger the validation event. To overcome this, you can add ValidateEmptyText="true"
attribute to custom validator or can use separate required field validator to validate empty values.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.