ajax - HTML5 History API: go back and don't allow going forward (popState?) -

i have webpage shows user information. i'm using ajax allow user modify data without changing webpage.

the structure simple:

-when user goes profile can see data.

-if user clicks edit button, form seen modify data.

-if user sends form, data saved , static data shown again (updated). the user shouldn't able go edit page using back button.

-if user clicks when editting, static data shown again.

-if user clicks when seeing static data, should always go previous page (not profile).

i'm using html5 history api handle back button clicks. i'm having problems when user submits data, since want him go previous state (not editing) without being able go forward. waht i'm doing right now:

// edit button clicked. function edit1(){     history.pushstate("edit", null, "");     showform(); }  window.addeventlistener("popstate", function(e) {     var historystate = history.state;     if(historystate == null){        showstaticdata();     }     else if(historystate == "edit1"){         showform();     } });  $('#myform').submit(function () {      ...      history.back(); // code when form has been submitted      return false; }); 

if use history.back() i'm doing in code above works fine except fact user able click forward button. if use replacestate or pushstate, forward button disabled, user can click back button , stay in same page (i don't want that).

is there way disable forward button without adding new state? (i don't want user click back , stay in same page)

use virtual states

a virtual state state explicity set "non displayable state": main goal reset forward states. call these specific virtual states "removed" states.

i have used principle several web applications, , works perfectly.

it's pushing states not make application move, clear history state.

history.pushstate({removed:true}, 'yourcurrenttitle','yourcurrenturl');

on popstate events, make script not launch usual behaviour if these removed states encountered.

---

notes

• any new pushstate while being on removed:true history.state should transformed replacestate
• you have handle problem of skipping these removed states if allow application remove state between 2 others
• you have deal initial (document.ready) cases when user comes on removed (virtual) state. in case redirecting user on "real" standard state avoid problem , not have history filled removed states. is, if try handle f5 (reload page) feature of browser.