I have a one requirement like changing the textboxes
background whenever validation fails at that time I used the custom validator
and JavaScript function to validate textboxes and change the textboxes
background color for that write the following code in your aspx page
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1"
runat="server">
<title></title>
<script language="javascript" type="text/javascript">
function
changeColor(source, args) {
var txtuser =
document.getElementById('txtUsername');
var txtpwd =
document.getElementById('txtPwd');
var txtfname =
document.getElementById('txtfname');
var txtlname =
document.getElementById('txtlname');
var strimg = new Array();
strimg = [txtuser, txtpwd,
txtfname, txtlname];
if
(args.Value == "") {
args.IsValid = false;
document.getElementById(source.id.replace('cv','txt')).style.background
= 'orange';
}
else {
args.IsValid = true;
document.getElementById(source.id.replace('cv', 'txt')).style.background
= 'white';
}
}
</script>
</head>
<body>
<form id="form1"
runat="server">
<div>
<table>
<tr>
<td colspan="2">
<b>Change Background of Textbox</b>
</td>
</tr>
<tr>
<td>
UserName:
</td>
<td>
<asp:TextBox ID="txtUsername"
runat="server"></asp:TextBox>
<asp:CustomValidator ID="cvUsername"
runat="server"
SetFocusOnError="true"
Display="Dynamic"
ValidateEmptyText="true" ControlToValidate="txtUsername"
ClientValidationFunction="changeColor">
<img src="Images/error.gif"
align="middle"/>Please
enter UserName
</asp:CustomValidator>
</td>
</tr>
<tr>
<td>
Password:
</td>
<td>
<asp:TextBox ID="txtPwd" runat="server"></asp:TextBox>
<asp:CustomValidator ID="cvPwd" runat="server"
SetFocusOnError="true"
Display="Dynamic"
ValidateEmptyText="true" ControlToValidate="txtPwd"
ClientValidationFunction="changeColor">
<img src="Images/error.gif"
align="middle"/>Please
enter Password
</asp:CustomValidator>
</td>
</tr>
<tr>
<td>
FirstName:
</td>
<td>
<asp:TextBox ID="txtfname"
runat="server"></asp:TextBox>
<asp:CustomValidator ID="cvfname"
runat="server"
SetFocusOnError="true"
Display="Dynamic"
ValidateEmptyText="true" ControlToValidate="txtfname"
ClientValidationFunction="changeColor">
<img src="Images/error.gif"
align="middle"/>Please
enter FirstName
</asp:CustomValidator>
</td>
</tr>
<tr>
<td>
LastName:
</td>
<td>
<asp:TextBox ID="txtlname"
runat="server"></asp:TextBox>
<asp:CustomValidator ID="cvlname"
runat="server"
SetFocusOnError="true"
Display="Dynamic"
ValidateEmptyText="true" ControlToValidate="txtlname"
ClientValidationFunction="changeColor">
<img src="Images/error.gif"
align="middle"/>Please
enter LastName
</asp:CustomValidator>
</td>
<tr>
<td>
</td>
<td>
<asp:Button ID="Button1"
runat="server"
Text="Submit"
/>
</td>
</tr>
</tr>
</table>
</div>
</form>
</body>
</html>
Here we need to observe one point that textbox name and
customvalidator names should be similar because here I have taken username
textbox value ‘txtUsername’ and username custom validator name as ‘cvUsername’
in javascript function we have chance to get custom validator control name
based on that I am simply replacing the cv with txt in javascript function and
changing the textbox background color.
