How to send the content of a textarea into a new window

Question

I wanna know how do you send the content of the textarea into a new window by using the Window open() method.

heres is my little code:

HTML

 <textarea name="textcode"></textarea>
 <button  type="submit" onclick="myFunction()">Open in New window</button>

Javascript

function myFunction() {
    window.open("insert the new window path here");
}

Check out this [similar question](http://stackoverflow.com/questions/9399354/how-to-open-a-new-window-and-insert-html-into-it-using-jquery) — Vikas Arora, Jan 31 '15 at 09:34
What does the new window contain? Only the text? So is this what you want? `'data:text/plain,' + document.querySelector('textarea[name=textcode]').value` — tsh, Jan 31 '15 at 09:46
if i type in hello in the textarea, the new window should have a hello word that is bolded. is it possible ? and by the way where should exacltly put the code? im new in javascript and php — MasutaPogi, Jan 31 '15 at 09:50
Please explain how this relates to PHP or remove the "php" tag. — Jukka K. Korpela, Jan 31 '15 at 09:56
*How* would you send the textarea content into a new window? What is the document opened in it supposed to contain, and in which sense would you send a string into it? — Jukka K. Korpela, Jan 31 '15 at 10:31

Nishit Maheta · Answer 1 · 2015-01-31T10:01:09.283

use below code using jquery.

HTML

<textarea name="textcode" id="text"></textarea>
<button  type="button" id="openwindow">Open in New window</button>

jquery

$(document).ready(function(){
    $('#openwindow').click(function(){
      var value  = $('#text').val();
      window.open('https://www.google.co.in/?#q='+value);
    });
});

you can pass value as params.include path and params. you will get value of text area in query string .using PHP $_GET['param'] you will print data in new window.

using pure javascript HTML

<textarea name="textcode" id="text"></textarea>
<button  type="button" onclick="myFunction();">Open in New window</button>

javascript

 function myFunction(){
    var value  = document.getElementById("text").value;
    window.open('https://www.google.co.in/?#q='+value);
 }

The question was not tagged with jquery, and jquery is hardly useful here as compared with plain JavaScript. — Jukka K. Korpela, Jan 31 '15 at 09:54

kasper Taeymans · Answer 2 · 2015-01-31T11:50:38.327

Why trying to send data between windows if you can have direct access to the content/DOM of the parent window? This will give you advantages when the content of your textarea is/can be changed. The "child page" will keep a reference to the page that opened it!

parent.html

<textarea id="mytext" name="textcode"></textarea>
<button  type="submit" onclick="myFunction()">Open in New window</button>
<script>
function myFunction() {
    //open popup/window on the same domain
    window.open('newwindow.html','newwindow','width=350,height=350');
}
</script>

When the new window opens you can have access to it's parents DOM only if they are on the same domain.

In your newwindow.html you can access your textarea (or any other DOM element) with window.opener:

window.opener.document.getElementById("mytext").value

Like I said, this only works when your parent and child windows are on the same domain. You will run into "same-origin policy errors" when parent and child aren't in the same domain.

However! you can use Window.postMessage to safely pass data between windows that aren't on the same domain. This isn't supported that well in all browsers.

otherWindow.postMessage(message, targetOrigin, [transfer]);

You can find an example and additional information (like browser support etc) on the dev pages of mozilla here

How to send the content of a textarea into a new window

2 Answers2