On editing form text fields Sep08 '05
On many web forms, it’s typically desirable to do one of two things:
- Provide brand new information
- Edit previously entered information
If the user is entering brand new information, sometimes there is already an example value in the text field. This is helpful in assisting the user as to what type of data should be entered. If this is the case - when the user enters that field, all of the text should be selected, so the user doesn’t have to delete text, before they enter their own:
If the user is editing previously entered information, then they probably won’t want all of the text to be selected.
Why is this the case?
Because sometimes it’s desirable to edit only a portion of the text string, such as a word in the middle. If all of the text is selected, then the user has to click more than once, just to get the curser to the right spot.
For example, the first click would highlight all of the text, and the second click would provide the curser at the exact spot clicked. Two clicks is too much, just to start typing in a text field.
Below are two examples, to try out. The first text field highlights all of the text, when you click in the field. The second one positions the curser wherever you click.
In the "Previously Entered" example - suppose you just wanted to change the word ‘entered’ to something else. You can easily just click near the word ‘entered,’ and use the keyboard to edit it.
JavaScript use
The first example, "Brand New," uses a small snippet of JavaScript, within the input element:
onFocus="this.select()"
Categories: JavaScript 
, Usability , Web Development
Add Feedback (view all)
Leave feedback
is published and produced by Matt Thommes - an independent publishing enthusiast, mobile blogger, content creator, informative writer, web developer from Chicago.
Never one to conform, Matt intends to promote the effect the web has on our lives, in an effort to intensify, instruct, and clarify all that is happening around us.
- FEMA always trying to be CNN
- Have a mint, if you can open the box
- Social networking: say it; don't spray it
Similar Entries
- Use Twitter to save on text message charges (65 recent visits)
- Windows FTP and text editors? (4 recent visits)
- Excel text manipulation rocks (1682 recent visits)
- Text highlighting in search results (948 recent visits)
- Google Notebook text highlighting (4 recent visits)
- Text link ads are advertisements (2 recent visits)
Stats
114 unique visits since August 2008
Recent Referrers (click)
- remove text field forms Word
- removing form field text on focus
- remove text highlights in form fields
- remove text highlights in form fields
- search box remove text on focus
- onfocus text hide function
- http://delicious.com/jeebs/for
- editing text form fields
- Word remove "Text form fields"
- web page maker formtext
- how to remove text form word in javascript
- how to remove text form word in javascript
- remove form field in word
- word - remove form field save text
- remove text on focus
- word remove form field
- word remove text form field