Add to browser history without page reload

Question

Basically, I have a page that contains a form. When a user submits that form, a Javscript function is called and the user is dynamically presented with a new form.

At this point, what I would like is for the user to be able to click the browser's back button and be taken back to the first form. Is this possible?

---

Thanks for the quick responses, but I am having trouble getting pushState to work. The HTML still displays "second form" after I click the back button.

Here is the code I used to test it:

<script>
function newPage(){
    history.pushState({state:1}, "State 1", "?state=1");
    document.getElementById('formBox').innerHTML="second form";
}
</script>


<input type="button" onclick="newPage();" value="forward" />
<div id='formBox'>first form</div>

Answer 1

var stateObj = { foo: "bar" };
history.pushState(stateObj, "page 2", "bar.html");

Relevant link to the docs.