Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to pass javascript object from one page to other

I want to pass javascript object from one page to other page so anyone can tell me how to do it?

Is that possible to do so using jQuery?

like image 497
Dipen Avatar asked Oct 10 '11 06:10

Dipen


People also ask

How do I move an object from one page to another?

If you navigate from one page to another, they don't exist at the same time, so you can't communicate like that. You would have to serialise the object into a string that you can send along in the request, for example sending JSON in the query string.

How do I pass data from one page to another in JavaScript?

Simpler way to do it is by adding it to the link which is fine when you have static values. But in case of variables your only option is JavaScript. And then all you have to do on the second page is just read the values from the URL params.

How do you pass an object into an object?

To pass an object as an argument we write the object name as the argument while calling the function the same way we do it for other variables. Syntax: function_name(object_name); Example: In this Example there is a class which has an integer variable 'a' and a function 'add' which takes an object as argument.

Can I pass object in function JavaScript?

We can pass an object to a JavaScript function, but the arguments must have the same names as the Object property names.


2 Answers

Few ways

  1. Server side postback

    Have a POST form on your page and save your serialized object inside a hidden input then post it to the other page. You will be able to process that data on the server and most likely put it back somehow into the page. Either as javascript object or anything else.

  2. Client side URL examination

    Make a GET request to your other page by attaching your serialized object to URL as:

    http://www.app.com/otherpage.xyz?MyObject=SerializedData

    That other page can then easily parse its URL and deserialize data using Javascript.

  3. What's in a window.name = local cross-page session

    This is a special technique that's also used in a special javascript library that exposes window.name as a dictionary, so you can save many different objects into it and use it as local cross-page-session. It has some size limitations that may affect you, but check the linked page for that and test your browsers.

  4. HTML5 local storage

    HTML5 has the ability of local storage that you can use exactly for these purposes. But using it heavily depends on your browser requirements. Modern browsers support it though and data can be restored even after restarting browsers or computers...

  5. Cookies

    You can always use cookies but you may run into their limitations. These days cookies are not the best choice even though they have the ability to preserve data even longer than current window session.

Javascript object serialization

You will of course have to use some sort of a (de)serializer on your client side in some of the upper cases. Deserializers are rather easy to find (jQuery already includes a great function $.getJSON()) and are most likely part of your current javascript library already (not to even mention eval()).

But for object to JSON string serialization I'd recommend json2.js library that's also recommended by John Resig. This library uses in-browser implemented JSON (de)serialization features if they exist or uses it's own implementation when they don't. Hence recommendation.

like image 112
Robert Koritnik Avatar answered Nov 15 '22 16:11

Robert Koritnik


That is only possible if the pages exist at the same time, and one page is opened from the other so that you have a reference to the other pages windows object.

If you navigate from one page to another, they don't exist at the same time, so you can't communicate like that. You would have to serialise the object into a string that you can send along in the request, for example sending JSON in the query string.

There are different ways of persisting data, like in the query string, post data, cookies, window name or HTML5 local storage, but all those methods can only persist string values, not Javascript objects.

like image 38
Guffa Avatar answered Nov 15 '22 17:11

Guffa