CODEWITHSUNDEEP
javascriptcookiesfragment-identifier
LordZardeck
LordZardeck

Reputation: 8293

handling multiple tabs with hashbang

I have a single page app that can have multiple tabs open with each tab doing different actions. if a user hits refresh or back, however, they lose everything they were working on. Is there a way, possibly with a combination of hash-bangs and cookies, to prevent the loss? for example, if the user was to refresh, all the tabs they were using would be opened back up.

Upvotes: 0

Views: 208

Answers (2)

Saebekassebil
Saebekassebil

Reputation: 714

You'll probably want to use the onbeforeunload event. This event is called (as the name suggests) just before the user "unloads" (refresh/redirect/etc.) the page and it allows you to warn the user that he's trying to get away from a page with unsaved data.

window.onbeforeunload = function(e) {
  e = e || window.event;
  var warning = 'You\'ve made changes to this page. Are you sure you don\'t want to save them?';

  if(e) {
    e.returnValue = warning;
  }

  return warning;
}

See the MDN Docs for a more detailed overview of the event.

There's plenty of ways to save the data, such as localStorage, IndexedDB, AJAX to a server and (lastly) Cookies.

Upvotes: 1

Rob W
Rob W

Reputation: 349142

I recommend against cookies, since they create an unnecessary overhead to the HTTP requests.

AmplifyJS provides cross-browser support for persistent data, using localStorage where possible, with fallbacks to sessionStorage, globalStorage and userData (IE).

Upvotes: 2

Related Questions