The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

2 Pages V  1 2 >  
Reply to this topicStart new topic
> Form Textfields wont reset in Firefox and Edge
Terminator
post Sep 18 2016, 12:01 AM
Post #1


Advanced Member
****

Group: Members
Posts: 218
Joined: 19-March 15
Member No.: 22,398



If you hit the refresh button in Firefox and Edge the Textfields dont reset. The only way to is to Ctrl F5. I have a reset form button but would still like it to reset on refresh.

I have been searching on this for awhile, and dont want to use the autocomplete="off" answer that many sites gave. Also an onload form reset code doesn't seem to work either.

This problem has been going on for years it seems:

http://stackoverflow.com/questions/2486474...h-with-meta-tag

http://stackoverflow.com/questions/1310798...blem-in-firefox

Chrome doesn't have any issues, it resets entire form on refresh.

Anyone have any suggestions?

thanks

*******EDIT******

Just found this from a website that posted it over 10 years ago, and it does the trick. I put it under window.onload = function()

Let me know if you think there is a better way of doing this but I think this should be fine.

CODE

var t = document.getElementsByTagName("input");
    for (var i = 0; i < t.length; i++)
    {
        t[i].value="";
    }


I cant believe how many incorrect answers are on sites like stack overflow

This post has been edited by Terminator: Sep 18 2016, 12:12 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 18 2016, 03:20 AM
Post #2


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



QUOTE(Terminator @ Sep 18 2016, 07:01 AM) *


Just found this from a website that posted it over 10 years ago, and it does the trick. I put it under window.onload = function()

Let me know if you think there is a better way of doing this but I think this should be fine.

CODE

var t = document.getElementsByTagName("input");
    for (var i = 0; i < t.length; i++)
    {
        t[i].value="";
    }


I cant believe how many incorrect answers are on sites like stack overflow



But that was suggested at Stackoverflow also.

http://stackoverflow.com/a/2950410
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 18 2016, 04:03 AM
Post #3


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



I've never had the need to do this, but I think I'd rather do it like this.

CODE
function resetIt()
{
   document.getElementById("theform").reset();
}

window.onload = resetIt;


The advantage as I see it is that it resets the form to its initial values which may or may not be empty. That is, prefilled values are restored.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 18 2016, 08:13 AM
Post #4


.
********

Group: WDG Moderators
Posts: 8,247
Joined: 10-August 06
Member No.: 7



QUOTE(Terminator @ Sep 18 2016, 07:01 AM) *

This problem has been going on for years it seems

Yes, found this from year 2000: https://bugzilla.mozilla.org/show_bug.cgi?id=46845 unsure.gif Not sure what (if anything) the W3C specs say.

FWIW, Jakob Nielsen advices against Reset buttons: https://www.nngroup.com/articles/reset-and-cancel-buttons/ "it is usually faster to edit the old data than to erase it and start over". Maybe he's right: why would the user need to erase the entire form?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 18 2016, 08:26 AM
Post #5


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



IIRC at least the Mozilla guys don't see it as a bug but as a feature. Maybe for the same reason my dear uncle detests reset buttons.

Haven't given this much thought before, but now when I think about it I think I like a form that can be reloaded without losing data *if* it has a reset button so I have a way to clear it all should I want to.

Typical scenario when I want to clear a form. I'm going to buy something and I can't find out how much the shipping is before I've filled in my location and so on. I don't want to risk anything (like spam emails), so I do the qwerty thing, with real data only for the essential parts. If I'm OK with the cost I want to clear the form and fill in my real details.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 18 2016, 10:09 AM
Post #6


.
********

Group: WDG Moderators
Posts: 8,247
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Sep 18 2016, 03:26 PM) *

Haven't given this much thought before, but now when I think about it I think I like a form that can be reloaded without losing data *if* it has a reset button so I have a way to clear it all should I want to.

At least newer Invision forums may save everything you type into the textarea (only as local storage, I hope), so even if you erase what you've typed into a thread's quick reply textarea it's added back the next time you open the thread. A bit annoying to me.

QUOTE
If I'm OK with the cost I want to clear the form and fill in my real details.

Can't you just overwrite the dummy text with the real one?

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Terminator
post Sep 18 2016, 11:02 AM
Post #7


Advanced Member
****

Group: Members
Posts: 218
Joined: 19-March 15
Member No.: 22,398



QUOTE(pandy @ Sep 18 2016, 03:20 AM) *


But that was suggested at Stackoverflow also.

http://stackoverflow.com/a/2950410


Instead of using getElementsByTagName, he was using getElementById and typing each text field one at a time. That is way too much coding if you have a lot of text fields on your form.

The post on that page that was marked as the "correct" answer gave me the biggest laugh though. When the guy said "There is something you can do about, but it's very messy". Not true at all, a simple for loop took care of it for me.


QUOTE(pandy @ Sep 18 2016, 04:03 AM) *

I've never had the need to do this, but I think I'd rather do it like this.

CODE
function resetIt()
{
   document.getElementById("theform").reset();
}

window.onload = resetIt;


The advantage as I see it is that it resets the form to its initial values which may or may not be empty. That is, prefilled values are restored.


This actually does not work in Firefox, and this same thing was mentioned many times on Stack Overflow, I went through about 15 links from them. Maybe it used to work years ago, or the people typed the answer there without trying it.


QUOTE(Christian J @ Sep 18 2016, 08:13 AM) *

FWIW, Jakob Nielsen advices against Reset buttons: https://www.nngroup.com/articles/reset-and-cancel-buttons/ "it is usually faster to edit the old data than to erase it and start over". Maybe he's right: why would the user need to erase the entire form?


I think it depends on what the form is doing as to why you would want to clear it out. Something like the link below they might want a clear button because many of the people using that form are a business themselves, a mortgage company trying to get fees for their client. So they would be inputting info constantly and if they started doing one on the wrong property they can reset the entire form to start from scratch, rather then typing over because they might accidentally tab through a field and forget to change it.

http://facc.firstam.com/

This post has been edited by Terminator: Sep 18 2016, 11:04 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 18 2016, 11:43 AM
Post #8


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



QUOTE(Terminator @ Sep 18 2016, 06:02 PM) *

Instead of using getElementsByTagName, he was using getElementById and typing each text field one at a time. That is way too much coding if you have a lot of text fields on your form.


I meant the concept. Setting the fields to an empty value. What way you go about it isn't that important.


QUOTE

This actually does not work in Firefox, and this same thing was mentioned many times on Stack Overflow, I went through about 15 links from them. Maybe it used to work years ago, or the people typed the answer there without trying it.


Really? Which of the threads? I don't have a problem with FireFox.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 18 2016, 11:48 AM
Post #9


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



This is the only time I see reset() mentioned. What do you refer to?
http://stackoverflow.com/a/24556494

It works fine in 47.0. Most current is 47.0.1 so I don't think that's an issue. Did you try it and in what version of FF?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Terminator
post Sep 18 2016, 11:49 AM
Post #10


Advanced Member
****

Group: Members
Posts: 218
Joined: 19-March 15
Member No.: 22,398



QUOTE(pandy @ Sep 18 2016, 11:43 AM) *

QUOTE(Terminator @ Sep 18 2016, 06:02 PM) *


This actually does not work in Firefox, and this same thing was mentioned many times on Stack Overflow, I went through about 15 links from them. Maybe it used to work years ago, or the people typed the answer there without trying it.


Really? Which of the threads? I don't have problem with FireFox.


I put in your code with my form name and it did not work. Maybe I am doing something extra that blocks that, but it did not work in FireFox or Edge until I used my method.

Stack Overflow does have good info if you know how to find it, but not on this question for me. I went through at least 15 posts that said stuff like:

CODE

<input type="text" autocomplete="off" />


or

CODE

$('#inputid').val('');


and I wasnt about to turn autocomplete off, and the second example also did not work for me.

This post has been edited by Terminator: Sep 18 2016, 11:50 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 18 2016, 11:53 AM
Post #11


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



Your name meaning name=""? Or id=""?

Still, I don't find the comments saying it doesn't work in FF in those threads.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 18 2016, 04:05 PM
Post #12


.
********

Group: WDG Moderators
Posts: 8,247
Joined: 10-August 06
Member No.: 7



Just some nitpicking:

QUOTE(pandy @ Sep 18 2016, 11:03 AM) *

CODE
window.onload = resetIt;


window.onload can only be used once on a page, so it may conflict with existing ones. In contrast,

CODE
window.addEventListener('load', resetIt)

can be used multiple times. But it may be even better to use

CODE
window.addEventListener('DOMContentLoaded', resetIt);

since it fires as soon as the HTML is loaded, not waiting for e.g. images to load.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 18 2016, 05:57 PM
Post #13


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



I'm more interested in if you've ever heard of FF not handling reset(). Can't find a thing about it.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 18 2016, 09:15 PM
Post #14


.
********

Group: WDG Moderators
Posts: 8,247
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Sep 19 2016, 12:57 AM) *

I'm more interested in if you've ever heard of FF not handling reset(). Can't find a thing about it.

No, it works in my FF too. But I just learned resetting forms doesn't affect hidden input fields (in any browser), from my quick test it doesn't matter if you use a Reset button or the JS reset() method.

My post above was partially aimed at Terminator, in case he already used a window.onload event somewhere. BTW here's another FF quirk that's annoyed me before: http://www.neiland.net/blog/article/turn-o...pt-development/

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 19 2016, 03:21 AM
Post #15


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



QUOTE(Christian J @ Sep 19 2016, 04:15 AM) *

No, it works in my FF too. But I just learned resetting forms doesn't affect hidden input fields (in any browser), from my quick test it doesn't matter if you use a Reset button or the JS reset() method.


Don't understand. How would they have been changed in the first place?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 19 2016, 07:01 AM
Post #16


.
********

Group: WDG Moderators
Posts: 8,247
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Sep 19 2016, 10:21 AM) *

Don't understand. How would they have been changed in the first place?

Javascript might change them.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 19 2016, 07:19 AM
Post #17


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



I thought you maybe meant that. Interesting. Reloading the page doesn't clear it either. Didn't know that either. Wonder what the rationale is behind this.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 19 2016, 08:45 AM
Post #18


.
********

Group: WDG Moderators
Posts: 8,247
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Sep 19 2016, 02:19 PM) *

Wonder what the rationale is behind this.

Seems they've made a mistake and now it's too late to fix:

"As much as I agree with the points raised, unfortunately, what the spec describes is what browsers already do. There is therefore not much room for us to make the spec more sensible on this front."
https://www.w3.org/Bugs/Public/show_bug.cgi?id=8506


User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 19 2016, 02:57 PM
Post #19


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,442
Joined: 9-August 06
Member No.: 6



Do you know if the mistake in older HTML specs also?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Sep 19 2016, 04:03 PM
Post #20


.
********

Group: WDG Moderators
Posts: 8,247
Joined: 10-August 06
Member No.: 7



Haven't tried deciphering the specs, but my guess is it's an oversight from the beginning.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

2 Pages V  1 2 >
Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 22nd November 2019 - 06:19 AM