Save Textarea on Wordpress Frontend

Question

So I have absolutely no idea where I should start on this, other than obviously creating a textarea.

Basically I'm upgrading a platform and on the previous platform, everything ran through php frames. Because of this, I could stick a textarea in one of the frames that was constantly showing and when people switched pages, the content would still be there on that person's computer until they reloaded the site or something like that.

What I need is to basically duplicate this. Now, I know I can't do frames, but I was thinking, what if I could add a save button that would save the content of that box. Of course, that would generally save it globally for all users, which is not good since there will likely be times where multiple people will hit save at the same time and someone will lose their content. So is there a way that I can save this content locally, or maybe save it only for the user who pressed save?

Answer 1

You can use Javascript to save to localStorage which allows you to store a fair amount of data locally. The amount differs between browsers, but I believe it's generally between 2MB and 5MB which is typically more than enough.

Here's some documentation by Mozilla on localStorage: https://developer.mozilla.org/en/docs/Web/API/Window/localStorage

And here's a table of storage capacity for localStorage on different browsers: http://dev-test.nemikor.com/web-storage/support-test/

The basic syntax is as follows:

// Data to store locally
var data = { 
     foo: 'bar',
     bar: 10
};

// Set some localStorage called 'myData' equal to the data object above
localStorage.setItem('myData', data);

// Get the data back out of localStorage
var savedData = localStorage.getItem('myData');

// Log it to the console
console.log(savedData);

// { foo: 'bar', bar: 10 };

I hope this was helpful.

Answer 2

Found my answer here: https://stackoverflow.com/questions/7892446/how-to-save-to-localstorage-from-textarea

Pretty much exactly what I wanted. I may try to work this so that it autosaves, but other than that it is working perfectly for now.