Developer Forums | About Us | Site Map
Search  
HOME > TUTORIALS > DESIGN AND LAYOUT > USABILITY TUTORIALS > USING WEB WIDGETS WISELY, PART 2


Sponsors





Useful Lists

Web Host
site hosted by netplex

Online Manuals

Using Web widgets wisely, Part 2
By Jodi Bollaert - 2004-03-19 Page:  1 2 3 4 5 6 7 8 9 10

Client-side validation of text boxes

Developers often have a hard time deciding how to format text boxes when the user's entry can be in one of several formats. Figure 5 shows an example of the variety of ways users could enter a phone number in an open text box.

Figure 5. Phone entry variations
Phone entry variations

One solution developers sometimes come up with is to create a pre-formatted text box to more clearly indicate how the data should be entered (see Figure 6).

Figure 6. Formatted phone number text box
Formatted phone number text box

While pre-formatted text boxes will make text entry requirements more clear, splitting one field into three fields can also make data entry more cumbersome. Also, because only the first field has a field label, users with screenreaders might be confused about what should be entered in the second and third fields.

A more user-friendly solution is to develop a client-side script that could not only validate the data, but also could remove non-essential characters. Thus the question of how to format the text box is no longer an issue.



View Using Web widgets wisely, Part 2 Discussion

Page:  1 2 3 4 5 6 7 8 9 10 Next Page: Date pickers

First published by IBM developerWorks


Copyright 2004-2017 GrindingGears.com. All rights reserved.
Article copyright and all rights retained by the author.