Losing Text Input on the Web

Question

How many times has this happened to you?

You are typing a long block of text into a form on a web page and you click next or submit or whatever. Then an error occurs. So you click back to fix the error and your whole spiel is gone!

Today I heard a coworker cussing at our help desk software, because he typed a long solution in and got an error, losing his text.

I told him that's happened to me so many times, that if I notice that I am typing a lot, I will open up notepad and type it all in there and then copy it.

So, I was wondering if there's anything a web-developer can do to guard against this? I've never thought about it while programming, but would like to be mindful of it in the future.

What can we do?

Answer 1

ASP.NET does this automatically by maintaining a Webform's ViewState.

Check this relevant page that discusses this very issue on W3schools.

So, my suggestions would be:

1. Make sure ViewState is turned on for forms that require user input (especially those where they have to enter a lot of stuff).

2. Test for this kind of usability issue by putting in validators that run server-side and then enter invalid data. The entered data on the page should remain intact after a response from the server.

Answer 2

Most good frameworks will maintain your input even after an error occurs. Asp.net too does that. As a developer when you are accepting input, do not redirect to another page.

Asp.net will get the data from the viewstate and put it in place.

The problem you mentioned(needing to click back), occured because your application probably presented you with a different page.

Validation errors are (in my opinion), best shown:

1. at the top of the page
2. next to the element in error
3. as a modal div.

This will retain the viewstate and users will not have to rewrite the data.

This also happens in a lot of php frameworks.

Answer 3

There are two key ways of doing things:

1. Keep the session alive by extending the session time (bad) or having the page poll the server before the session expired (better).

2. Process the session before processing the form when you submit. If, as I suspect, this has to do with the user being logged out, keep a cookie on hand to make sure you can log that user back in before thinking about touching the form data.

And most importantly (for both the above), save the form state when it is submitted!! That way, even if something does blow up, you can provide a "back to form" link and pump all the data straight into the form.

Answer 4

So you click back to fix the error and your whole spiel is gone!

Not with Firefox (in general...), it keeps the typed data and shows it back when you come back to the previous page.
Unless some stupid JavaScript erases the content of the field when getting focus or similar!

Even better, I use It's All Text! extension which adds a button to textareas, allowing me to edit the text on a convenient real text editor... (and update the field on each save).

Now, for the other users, you have to follow above advices...

But I would add something for the other common case: you type something long in the browser, and inadvertently close the tab/window or your browser/computer crashes, etc.
Sun forums have a nice feature, sending the content of the textarea to the server regularly with Ajax. So if you come back to your page, the server is able to restore your work in progress even if you have submitted nothing yet.