Mobile app version of vmapp.org
Login or Join
Alves908

: Why is my form deleting information once you leave an entry field and return to that entry field? So I have a created a contact form and once you enter information, it retains the information

@Alves908

Posted in: #Forms #Html #UserInput

So I have a created a contact form and once you enter information, it retains the information like a normal form should. However, when you try and edit the information on any of the form entry boxes, it instantly deletes any information that was located in that box and requires the user to renter their information anew.

Here is my code:

<div class="contatct-form">
<form>
<input type="text" value="Name " onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Name ';}">
<input type="text" value="Email " onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Email ';}">
<input type="text" value="Phone " onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Phone ';}">
<textarea rows="2" cols="70" onfocus="if(this.value == 'Message ') this.value='';" onblur="if(this.value == '') this.value='Message ';">Message </textarea>
<input type="submit" value="Submit">
</form>
</div>

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Alves908

1 Comments

Sorted by latest first Latest Oldest Best

 

@Mendez628

Well, that's because you have your onfocus set to clear the value. So when the user clicks on the input to edit the information, (the input element is in focus) the value is set to ''

May I ask what are you trying to achieve exactly?

Update:
The best way to get what you're trying to achieve is by using the placeholder attribute.
This might be of some help.

But you can also just have an if statement to check to what the value of the input element is. So your onfocus should be something like this

onfocus="if(this.value == 'Name ') { this.value = ''; }"


This is just for your first input, but that's the general idea.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme