The SitePoint Forums have moved.

You can now find them here.
This forum is now closed to new posts, but you can browse existing content.
You can find out more information about the move and how to open a new account (if necessary) here.
If you get stuck you can get support by emailing forums@sitepoint.com

If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Default text in forms

I want my forms to have the text label in side the field. For example, a text area would say "Name". Once the field is clicked the text label would disappear. Reappearing if the field is left without text entered.

Those disappearing texts are the default value of the input field, replaced with an empty value by a javascript on focus and then replacing the empty value (if it still is empty) with the same as the default value on blur.

erik, thanks, but I think you misunderstood. I want it to say "Name" by default, but the form has

HTML Code:

value="<?PHP ECHO $_POST[NAME]; ?>"

This is used to capture the value the user inputs, not grab a variable from a database. My predicament is that the "value" attribute is already being used for this, so how can I have a default, non dynamic text in the box, such as just "Your Name" rather than "$_POST[NAME] which is the value that the user fills in.

Sorry if that's really confusing! Maybe I just need a better form mail script!

This is used to capture the value the user inputs, not grab a variable from a database. My predicament is that the "value" attribute is already being used for this, so how can I have a default, non dynamic text in the box, such as just "Your Name" rather than "$_POST[NAME] which is the value that the user fills in.

Sorry if that's really confusing! Maybe I just need a better form mail script!

It is somewhat confusing. ...To me at least.

Guess you have the receiving php-script valuating the form, and if failing it will user-friendly return the form with entered correct data refilled.

If so, you only need to add a condition to the php-script to echo "Your Name" if the array $_POST[NAME] is not set.

Then revise the java-script in the input tag to use that "default" value on focus/blur:

Thanks Erik! Working great, just one issue... on the page load the default text is not displayed. It only appears when I click in the field, is there a way to have the labels load with the page?

I guess you have not set a default value. In that case the input value is empty from start but then the value is inserted on blur.

On load the input should have the default value. If form is submitted with error and returned the input should have the returned value.

In case you are all new to php and have no idea how to get the default value from start, you can try this code in the page (no offense by the newbe comments):

Code:

Place the script anywhere before the input
<?php
$defaultvalue = 'Your Name'; // store a default value
// detect if form was submitted and use entered value or use the default value
if (isset($_POST['name'])){ // check if POST variable is set.
$namevalue = $_POST['name']; // if true, get value and store it
}
else { // if false, the page is first loaded
$namevalue = $defaultvalue; // then set it to the default value
}
?>
Now use the variable $namevalue to set the input value
<input id="name" name="name" type="text" value="<?php echo $namevalue; ?>"
onBlur="this.value=(this.value=='') ? 'Your Name' : this.value;"
onFocus="this.value=(this.value=='Your Name') ? '' : this.value;" />