I have the following JS :

document.getElementById('sketchpad-post').setAttribute('value','')

The HTML input is as follow:

<input type="text" id="sketchpad-post" autoplete="off" value="" placeholder="Message"/>

If the second argument of the setAttribute function is an empty string, like in the example above, it doesn’t work : it doesn’t empty the text field (the text field has a previously set value).

Now if the second argument is a non-empty string, then, it works : it sets my text field to the provided value.

I find this behavior particulary strange…

I tried to enforce autoplete="off" (and even autoplete="flu") doing a setAttribute and also to do a removeAttribute('value') but I still cannot manage to have this field blank when the user display it.

As a workaround I can set the value to a kind of placeholder like '…' or whatever other character (an non-breakable space maybe?) but it’s not very nice.

I have this behavior in both latest Chrome (Chromium) and Firefox.

Any idea ?

I have the following JS :

document.getElementById('sketchpad-post').setAttribute('value','')

The HTML input is as follow:

<input type="text" id="sketchpad-post" autoplete="off" value="" placeholder="Message"/>

If the second argument of the setAttribute function is an empty string, like in the example above, it doesn’t work : it doesn’t empty the text field (the text field has a previously set value).

Now if the second argument is a non-empty string, then, it works : it sets my text field to the provided value.

I find this behavior particulary strange…

I tried to enforce autoplete="off" (and even autoplete="flu") doing a setAttribute and also to do a removeAttribute('value') but I still cannot manage to have this field blank when the user display it.

As a workaround I can set the value to a kind of placeholder like '…' or whatever other character (an non-breakable space maybe?) but it’s not very nice.

I have this behavior in both latest Chrome (Chromium) and Firefox.

Any idea ?

• javascript

• 1 document.getElementById('sketchpad-post').value=''; ...? – C3roe Commented Jun 10, 2017 at 2:05
• 1 It's working fine for me. Can you set up a snippet demonstrating the problem, or maybe a JS Fiddle? – KevBot Commented Jun 10, 2017 at 2:14
• @CBroe Thx a lot, it does work ! This is what I used first but for probably another reason it wasn’t working, so I then I came with setAttribute… Anyway I’m still upset that setAtttibute('value','nonemptystring') works but not setAtttibute('value','') doesn’t (?!) I expected e.setAttribute('value',foo) to be the exact equivalent of e.value = foo and it appears it is not the case when foo = ''. Weird. – Stéphane Commented Jun 10, 2017 at 2:18
• @KevBot This is part of some other code and I can’t easily do it (modal content…) but you’re right. I may try to write a code that demonstrates this behavior…if I’m told e.value = foo et e.setAttribute('value',foo) are supposed to be equivalent in any case I probably spotted a bug :\ – Stéphane Commented Jun 10, 2017 at 2:23

1 Answer 1

document.getElementById('sketchpad-post').value = "";