Client-Side Validation to change Textbox Background Color?

J

James Radke

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
 
M

MSFT

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.)
 
T

tommy

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
 
¥

¥xÆW·L³n§Þ³N³B¤ä´©³¡

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.)
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top