Default text in forms

[JonParks]

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.

Basically, just like they do in the comment fields as psdtuts.com...

Thanks for the help!

[JonParks]

I found this:

defaultvalue="Describe your application/needs..."

but it doesn't seem to do anything for me...

[Erik J]

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.

<input id="name" name="name" type="text" value="Name" onBlur="this.value=(this.value=='') ? 'Name' : this.value;" onFocus="this.value=(this.value=='Name') ? '' : this.value;">

[JonParks]

Thanks Erik.

My only issue is that for the form I already have a "value" as this form field is emailed to me...

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

[Erik J]

Just echo that value as the default.

<input id="name" name="name" type="text" value="<?php echo $_POST[SUBJECT]; ?>" onBlur="this.value=(this.value=='') ? '<?php echo $_POST[SUBJECT]; ?>' : this.value;" onFocus="this.value=(this.value=='<?php echo $_POST[SUBJECT]; ?>') ? '' : this.value;">

[JonParks]

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

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!

[AutisticCuckoo]

You can't. The value attribute is what is displayed in the input field.

[Erik J]

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:

<input id="name" name="name" type="text" value="<?php echo $_POST[NAME]; ?>" 
onBlur="this.value=(this.value=='') ? 'Your Name' : this.value;" 
onFocus="this.value=(this.value=='Your Name') ? '' : this.value;" />

[JonParks]

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?

[Erik J]

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):

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;" />

If I guessed your settings right, .

[JonParks]

Thank you Erik! It's working perfectly now except for the <textarea>.

Here is what I'm trying to use:

<p><textarea name="COMMENT" class="commentarea" cols="60" rows="10" tabindex="5" value="<?php echo $commentvalue; ?>" size="40" tabindex="1" onBlur="this.value=(this.value=='') ? 'Describe your application and needs' : this.value;" 
onFocus="this.value=(this.value=='Describe your application and needs') ? '' : this.value;" /></textarea>
</p>

[Erik J]

You have some errors in the textarea code.

The causing error is; the textarea value is not an attribute, but is between the tags.

It should be like this:

<p>
<textarea name="COMMENT" class="commentarea" cols="60" rows="10" tabindex="5" onBlur="this.value=(this.value=='') ? 'Describe your application and needs' : this.value;"  onFocus="this.value=(this.value=='Describe your application and needs') ? '' : this.value;"><?php echo $commentvalue; ?></textarea>
</p>

[JonParks]

In business! thanks again!