Client-Side Validation to change Textbox Background Color? -- asp.net webcontrols

James Radke
10/13/2003 11:36:28 PM

Hello,

I would like to create some type of client-side validation that will change
the background color of a textbox (say to red with white text) when the
entered data is invalid (i.e. not numeric, not a valid date, etc.)...

I have figured out one way to do that using javascript, and the existing
..NET expressionvalidation controls; however, this requires that I write a
new javascript function for each textbox controls OnChange event that I want
to validate so that I can reference the appropriate textbox control and it's
associated validation control. Additionally this forces me to hardcode the
long .NET generated ID's (i.e. __ctl_ctl0__<id>) - which is kind of a pain.

What I am wondering is if there is a better way that I can do this so that I
don't send the round-trip to the server after they exit each field and still
get the great notification/visual of the background color of the textbox
changing?
Thanks!

Jim

thomas.hauser NO[at]SPAM hannover-leasing.de
10/14/2003 4:58:59 AM

hello Jim,

to modify textboxes on client, for example the background, you have to
put following to your <asp:textbox>

onblur="this.style.backgroundcolor='#EEEEEE'"
onfocus="this.style.backgroundcolor='#38FAEA'"

best regards

tommy

[quoted text, click to view]

lukezhan NO[at]SPAM online.microsoft.com
10/14/2003 7:08:37 AM

Hi James,

I think you can still use the validator control in ASP.NET, including
RequiredfieldValidator, CompareValidator, RangeValidator,
RegularExpressionValidator, and especially, CustomValidator. You can
specify clientvalidfunction to it. And all these validating is perform with
client script. For more information on ASP.NET validator, you can refer to
this article:

http://msdn.microsoft.com/library/default.asp?url=/library/en-us/vbcon/html/
vboriwebformsvalidation.asp

Luke
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

lukezhan NO[at]SPAM online.microsoft.com (
10/16/2003 6:23:23 AM

Hi James,

As a supply, I attach a sample, to demo how we use a customvalidator
control to change a text box's backgroud color when its text is less than 8
charactors:

<asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 64px; POSITION:
absolute; TOP: 96px" runat="server"
Width="224px" Height="48px" ></asp:TextBox>
<asp:CustomValidator id="CustomValidator1" style="Z-INDEX: 102; LEFT:
376px; POSITION: absolute; TOP: 104px"
runat="server" Width="192px" Height="32px"
ControlToValidate="TextBox1" ClientValidationFunction="validateLength"
ErrorMessage=""></asp:CustomValidator>

<SCRIPT LANGUAGE="JavaScript">
function validateLength(oSrc, args){
args.IsValid = (args.Value.length >= 8);

if (args.Value.length < 8)
document.Form1.TextBox1.style.backgroundColor='#ffff00';

}

</SCRIPT>

Hope this help,

Luke
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

Got something to say? Click here to post a reply to this thread.

Don't see what you're looking for? Try a search.

View other messages about asp.net webcontrols

asp.net webcontrols : Client-Side Validation to change Textbox Background Color?