back button issue during form manipulation

Question

My Project is having 3 forms in 3 different pages say form1.cfm,form2.cfm,form3.cfm.

form1.cfm contains first form as follows

<form name="firstform" method="post" action="form2.cfm">
 // form-content
</form>

<a href="javascript:void(0);"onclick="javascript:document.firstform.submit();">Next</a>

form2.cfm(action page of first form) contains second form as follows

<form name="secondform" method="post" action="form3.cfm">
 // form-content
</form>

<a href="javascript:void(0);"onclick="javascript:window.history.back();">Back</a>
<a href="javascript:void(0);"onclick="javascript:document.secondform.submit();">Next</a>

form3.cfm(action page of second form) contains Third form as follows

<form name="Thirdform" method="post" action="form4.cfm">
 // form-content
</form>

<a href="javascript:void(0);"onclick="javascript:window.history.back();">Back</a>
<a href="javascript:void(0);"onclick="javascript:document.Thirdform.submit();">Next</a>

So when I use the Back button link in form2.cfm, it goes to the form1.cfm and no issues on it .when I do the same in form3.cfm, it must go to form2.cfm, but it asks for form resubmission, because I know that it is the action page of form1.cfm.

And I want to go for form2.cfm, when I use the back button link from form3.cfm and don't want to see the form resubmission page.

I don't know whether it is fixable or not. but suggestions or solution are welcome.

Thanks in Advance

Odalrick Odalrick · Accepted Answer · 2013-11-28T14:32:14

The problem is that by using POST, you are telling the browser "Hey, this form has effects that might not be appropriate to repeat."

You could change the method to GET, but that probably isn't appropriate either, because that says "This form has no effects, it's just to show stuff."

One solution is to not submit the form at all, but gather the data with JavaScript, send it with an XHR request and then navigate to the next form, again with JavaScript.

Another solution is to not have several separate forms at all. Just put them all in one master form. If that becomes to large, just use JavaScript to hide the parts that are inactive and have the next/back buttons open and close those parts.

back button issue during form manipulation

2 Answers