Skemelio Skemelio - 6 months ago 9
HTML Question

Javascript: Is there a simple way to pass data from one webpage to the other?

I have one .html file where I click some checkboxes and store some data on an array.

All I need is to pass the array data to one other .html file.

Searching the stackoverflow I found some answers, for example "How to pass javascript object from one page to other".

From what I figured out one way is to use Web Storage API and specifically the Window.localStorage.

The problem is that we have a deadline until tomorrow and I am trying to avoid studying a whole new API.

Answer

Here's an example using basic HTML and querystring manipulation without using localStorage or sessionStorage, although these are actually very simple APIs and worth looking into.

HTML1 (sender):

This page will get the string representation of an object and then escape its content for transport in the query string.

<script>
var obj = { givenName: 'John', familyName: 'Doe', age: 45 };
console.log(obj);
function passToNextPage() {
    window.location = 'test2.html?' + escape(JSON.stringify(obj));
}
</script>
<button onclick="passToNextPage();">Pass</button>

HTML2 (receiver):

This page unescapes the querystring and then parses the JSON text as an object, ready for use.

<script>
    var json = location.search.substring(1);
    json = unescape(json);
    var obj = JSON.parse(json);
    console.log(obj);
</script>