title: Passing large JSON object to another page in a new window.
body: <p>I apologize in advance if this has already been answered. I've Googled around for a few hours now, and I still haven't found anything that seems to answer my exact question. </p>
  
  <p>Essentially, I have a very complex/highly styled view which is displaying user-specific data pulled from the database. I've captured the data as a JSON object, attached it to the body my page using .data(). I've added a button that retrieves the JSON object and opens my printer friendly page in a new window. I want to be able to access/manipulate the user-specific JSON object from within this new window. (This would all be on the same domain.) </p>
  
  <p>Most of the solutions I've seen seem to be centered around opening a new, blank window. I don't want to do that. I've coded a layout for the page, and I plan on having javascript/css which also runs. I've seen solutions that involve opening a new window and then using document.write, which would be great, if there was a way to target a specific element on the new page. I've tried, for example:</p>
  
  <pre><code>x = window.open(url);
  x.document.write(myJson);
  </code></pre>
  
  <p>Which does put the JSON object on the new page, but completely wipes everything else I had in the layout. </p>
  
  <p>I've also seen solutions that suggest stringifying and then Base64 encoding the object. But I'm concerned about URL length restrictions, given that they could potentially be gathering a lot of data on this page before clicking the button. </p>
  
  <p>I've also seen solutions that suggest using HTML5 local storage. Which I suppose I'll do, if there's no better solution. However HTML5 raises browser compatibility issues, and I'd prefer to avoid them if possible.  </p>
  
  <p>Here's some example code:</p>
  
  <p>JSON object:</p>
  
  <pre><code>{ 
  {
  "name":"Percy Pea.",
  "bio":"Percy Pea was born in a pod, and lived there happily."
  },
  {
  "name":"James Cob",
  "bio":"James Cob was arrested for stalking."
  }
  }
  </code></pre>
  
  <p>I capture that when it comes back from the server as 'data':</p>
  
  <pre><code>$("body").data( "userData", data);
  </code></pre>
  
  <p>In my onclick for the printer friendly page button, I retrieve the JSON object:</p>
  
  <pre><code>var userData = $("body").data("userData");
  </code></pre>
  
  <p>So is this doable? Is there so way to open a new window, and then insert/attach data to a specific element inside it? Or...maybe some other way I haven't even considered.</p>
  
  <p>Thanks in advance for any help, although I will also be sure to check-mark the answer, once it's posted.  </p>