I know this in old issue but I can't figure out the best practices for dealing with the back button.
I'm writing a web application with lots of data movement between the browser and the backend server. I currently use post and of course when the user bypasses the application navigation and uses the back button both IE and Firefox popup messages asking the user if they want to resend the data.
I tried "get" and aside from all the data being displayed within the URL, IE8 still generates a message.
Additionally I can't really identify when the post causes a message and when it doesn't, since I have test cases posting data where the back button does not cause a message.
My environment is JavaScript, PHP and MySQL.
Any help or pointer to a research location is greatly appreciated.
Edited:
I wrote 3 little pages to test posting a->b->c->a and they don't cause any postdata messages. I don't know why:
A
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ".dtd">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test post A</title>
</head>
<body>
<h1>testPostA.php</h1>
<h3>Came from <?php print (isset($_POST['data'])?$_POST['data']:"NoWhere"); ?></h3>
<form action="testPostB.php" method="post">
<input name="data" type="text" value="from testPostA.php" />
<input type="Submit" value="Submit To: testPostB.php" />
</form>
</body>
</html>
B
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ".dtd">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test post B</title>
</head>
<body>
<h1>testPostB.php</h1>
<h3>Came from <?php print (isset($_POST['data'])?$_POST['data']:"No where"); ?></h3>
<form action="testPostC.php" method="post">
<input name="data" type="text" value="from testPostB.php" />
<input type="Submit" value="Submit To: testPostC.php" />
</form>
</body>
</html>
C
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ".dtd">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test post C</title>
</head>
<body>
<h1>testPostC.php</h1>
<h3>Came from <?php print (isset($_POST['data'])?$_POST['data']:"No where"); ?></h3>
<form action="testPostA.php" method="post">
<input name="data" type="text" value="from testPostC.php" />
<input type="Submit" value="Submit To: testPostA.php" />
</form>
</body>
</html>
I know this in old issue but I can't figure out the best practices for dealing with the back button.
I'm writing a web application with lots of data movement between the browser and the backend server. I currently use post and of course when the user bypasses the application navigation and uses the back button both IE and Firefox popup messages asking the user if they want to resend the data.
I tried "get" and aside from all the data being displayed within the URL, IE8 still generates a message.
Additionally I can't really identify when the post causes a message and when it doesn't, since I have test cases posting data where the back button does not cause a message.
My environment is JavaScript, PHP and MySQL.
Any help or pointer to a research location is greatly appreciated.
Edited:
I wrote 3 little pages to test posting a->b->c->a and they don't cause any postdata messages. I don't know why:
A
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test post A</title>
</head>
<body>
<h1>testPostA.php</h1>
<h3>Came from <?php print (isset($_POST['data'])?$_POST['data']:"NoWhere"); ?></h3>
<form action="testPostB.php" method="post">
<input name="data" type="text" value="from testPostA.php" />
<input type="Submit" value="Submit To: testPostB.php" />
</form>
</body>
</html>
B
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test post B</title>
</head>
<body>
<h1>testPostB.php</h1>
<h3>Came from <?php print (isset($_POST['data'])?$_POST['data']:"No where"); ?></h3>
<form action="testPostC.php" method="post">
<input name="data" type="text" value="from testPostB.php" />
<input type="Submit" value="Submit To: testPostC.php" />
</form>
</body>
</html>
C
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test post C</title>
</head>
<body>
<h1>testPostC.php</h1>
<h3>Came from <?php print (isset($_POST['data'])?$_POST['data']:"No where"); ?></h3>
<form action="testPostA.php" method="post">
<input name="data" type="text" value="from testPostC.php" />
<input type="Submit" value="Submit To: testPostA.php" />
</form>
</body>
</html>
3 Answers
Reset to default 5The Post/Redirect/Get pattern will prevent the re-POST warning. However, you still have to take care that your application can handle/reject duplicate form submissions and the like.
Edit 1
For an application that's heavy on Javascript, I've also seen some design patterns that leverage the browser history and fragment identifiers to provide a more seamless integration with the back button, bookmarking, etc.
Edit 2
Regarding the addendum to your question, it's hard to say. It could be that the in some cases the browser has the page cached and doesn't need to resubmit the POST to render the page again. You could play around with various ways of disabling browser caching on these requests to see if you can make the behavior more predictable (i.e. always cause the resubmit warning). At any rate, I think web applications that follow the Post/Redirect/Get pattern are slightly more user-friendly, but your mileage may vary.
Another thing to keep in mind is that you can use method="get" on forms that are performing queries, generating reports, etc. Sometimes GET is a better option in those read-only scenarios because it makes your URL scheme richer and avoids these sort of POST warnings.
You could use ajax to post your data, then when the response es back, redirect them to whatever page you'd like.
The user prompt to re-submit data is displayed when the page that they are trying to navigate to was first navigated to from a POST form submission. If you do any sort of AJAX POST'ing, the re-submit prompt will not be displayed if the user navigates back or forward to it.
To avoid ever getting this prompt, you could just use AJAX, or POST and then redirect. However, this is the behavior of a great many web applications (Amazon's cart, for example). I'm not fully aware of the context or behavior of your application, but I'm not fully convinced that this is a problem that you need to worry about, especially if you're not allowing duplicate data.