• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

Dynamically changing an inputText field's background color based on user input

 
Greenhorn
Posts: 3
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Hello, all,

The project that I am currently working on includes a requirement to validate an input field on the fly, as the user is typing. The idea is as follows:

- When the user begins typing in the field, the background color should change from the default white to yellow.
- When the user has typed a valid sequence of characters, the field should change back to white.
- If the user continues to enter further input, and that invalidates the string, the field should change back to yellow.

The project is being built with JSP, and I am using the <h:inputText> tag for my text box. As I'm very new to JSP, I am wondering if there is a simple solution involving an ActionListener or EventListener of some kind that I can use to implement this functionality. Has anyone here ever put something together like this?

I appreciate any help you can offer, including even a simple "there's no way you will get that to work." I just need to know if it's possible or not. Thanks in advance!
 
Sheriff
Posts: 13411
Firefox Browser VI Editor Redhat
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
The behavior you're describing needs to be written in the client code, (HTML/Javascript) not the server side (JSP/Struts).

I'm going to move this to our HTML/Javascript forum for you.
 
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Originally posted by Rob Phair:
The project is being built with JSP, and I am using the <h:inputText> tag for my text box.


<h:whatever> is not any standard JSP tag. Is this perhaps a JSF project? If so, it's important to state that.

As Ben pointed out, that something that needs to be done on the client, not the server.
If we were to ignore whatever snags that the use of JSF throws into the mix, this is a simple matter of placing a few JavaScript event listeners on the field and manipulating its CSS based upon its current value.
 
Ranch Hand
Posts: 261
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I'm just wondering, may be you can use the onkeydown event attribute of the textbox to invoke a JavaScript method, which can run the set of validations and set the textbox's backgorund colour accordingly.
As Bear says, <h:inputText/> is not a standard tag, so you'll have to see that your <h:inputText/> tag does support the "onkeydown" event attribute. If it does, then perhaps you can validate the text at the client side itself instead of engaging the server.
 
Ranch Hand
Posts: 89
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Can you perform validation of value on the client-side? If yes, simple JavaScript would be sufficient.

If no, you may still implement validation using AJAX.
 
reply
    Bookmark Topic Watch Topic
  • New Topic