Solved

Creating hints inside of textboxes

Posted on 2013-06-26
1
243 Views
Last Modified: 2013-09-20
Hi,

I am looking to create text formfield hints within these form fields that disappear when a user clicks inside the formfield to add their data for submission.

For example, I have a form with a textfield for a user to enter their firstname. I would like to have the word 'Enter Firstname' inside the text field but have it disappear when the user clicks into the field to enter their first name. However, as I need to verify that the user has indeed entered some data, if the user submits the form without actually entering any firstname data, the form would be 'returned' to the page with an error message. How do I create this hint within the form text field and 'strip' it way during form submission so my form validation would still work?

Thank you so much for helping me with this issue that has been haunting me for so long.
0
Comment
Question by:CFbubu
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
1 Comment
 
LVL 16

Accepted Solution

by:
Gurpreet Singh Randhawa earned 500 total points
ID: 39280750
for modern browsers you can always use placeholder [html5] element which will always work.

For IR you can use the Jquery Placeholder component.

<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
 <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
 <![endif]-->

<script src="assets/js/placeholder.min.js" type="text/javascript"></script>

with jquery you can do it like this

<script>
$(function() { $('input, textarea').placeholder();
});
</script>
0

Featured Post

Stressed Out?

Watch some penguins on the livecam!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

PROBLEM: How to add your own buttons to the bottom toolbar with paging info ( result count ). While creating a cfgrid, I ran into an issue where I wanted to embed my own custom buttons where the default ones ( insert / delete / etc… ) are for aes…
Hi. There are several upload tutorials using jquery and coldfusion. I found a very interesting one here Upload Your Files using Jquery & ColdFusion and Preview them (http://www.randhawaworld.com/) . I did keep the main js functions but made sever…
In this video, viewers will be given step by step instructions on adjusting mouse, pointer and cursor visibility in Microsoft Windows 10. The video seeks to educate those who are struggling with the new Windows 10 Graphical User Interface. Change Cu…
In this video, viewers are given an introduction to using the Windows 10 Snipping Tool, how to quickly locate it when it's needed and also how make it always available with a single click of a mouse button, by pinning it to the Desktop Task Bar. Int…

688 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question