ngzhongcai
ngzhongcai

Reputation: 2043

How to clear HTML input textbox via Javascript

I am using the same input textbox to collect multiple values.

After collecting the first input, I will clear the field by calling

document.getElementById("textbox").value= "";

On the surface, above snippet appears to clear the textbox. But when I blur the textbox by clicking elsewhere, the old value reappears.

MORE CODES >>>

My HTML >>

<input id="textbox" placeholder="Start">

Javascript >>

After getting the first input, I like to reset the input value >>>

document.getElementById("textbox").value= "";
document.getElementById("textbox").setAttribute("placeholder","End");

This is how I do my data collection >>> The same textbox is first used to collect a Google "place", and then subsequently to collect some user entered comment. In addition to collecting the data, someFunction() also try to clear the textbox by calling .value= ""

google.maps.event.addListener(textbox, "place_changed", function() {
    someFunction();
});

Upvotes: 1

Views: 6936

Answers (3)

Agam
Agam

Reputation: 1

I have practically implemented and used this solution whch is already suggested by my friend above:

document.getElementById("textbox").setAttribute("placeholder","End");

So, this works for me pretty well.(context:"placeholder" attribute used)

ICDT ..tc:)

Upvotes: 0

acostache
acostache

Reputation: 2275

Here is something i found googling fast for an answer; i think you can play around indeed with onFocus() a bit:

<input type="text" value="Click here to clear text" onfocus="if(!this._haschanged){this.value=''};this._haschanged=true;"/>

It may require a bit of usage of onBlur as well.

Also some other pointer, to get you going with jQuery if you want.

Upvotes: 1

Artem
Artem

Reputation: 432

Looks like your input's value is stored in separate variable to be used for some other actions. So you should maybe check your code and clear thar variable.

Upvotes: 0

Related Questions