Passing text to a new window

[ Studied  ...calculating..., 6 thanks ]

                                                                 

 

    Sometimes you need to pass a variable to another webpage which will open in a new window, with no connection whatsoever with the page the user is working on...except that variable... How can you do that without using any databases to store that variable, then retrieve it, and so on, without too much hustle ? Well, it is impossible ! Is it now ??? Well, actually, you can transmit a variable to another page, and that is through the address bar ! And in this tutorial I will show you how !

 

    A webpage is found by it's address, given in the address bar - for example http://windows-addict.com -. I am sure, though, that you've seen, sometimes, when you clicked a link, in the address bar appeared something like, let's say, http://www.windows-addict.com?some_characters_here.  That text after the question mark in the address is exactly what is transmitted to the newly opened page ! - can be variables (i.e: ...?id=the_id) or multiple variables (i.e: ...?id=the_id&name=the_name). Here I will show you how to "pass" a text to a new page.... you can do all kind of mutations and encodings to that text, and use it a million ways.... but I will teach you now just the basic stuff.

 

    If you want to see a working example, just enter your desired text below, press the "Submit" button, and watch your text being displayed in a new page.

 

 

 

    Ok...let's get to work....

 

        1.The "Calling page":

 

    In the calling page, yo have to define a variable in which to store your text...let's call it text_hugger...

 

<script>

var text_hugger='This is were the text will be stored"

</script>

 

    When your text variable is ready to be transmitted (after all the data modification are completed), call the procedure that will launch the new page

 

<script>

readytogo()

</script>

 

    And, finally, your actual calling procedure will consist of two lines: one will define the address for the new page, which will contain your variable, and the other will open that new page.

 

<script>

function readytogo() {

 new_address="path_to_your_file/your_new_file?"+text_hugger;

 window.open(new_address,'_blank','width=700, height=700');

}

</script>

 

    So, to sum it up, this whole thing will look in your page like:

 

<html>

.....

<head>

<script>

var text_hugger="This is where the text will be stored"

function readytogo(){

 new_adress="path_to_your_file/your_new_file?"+text_hugger;

 window.open(new_adress,'_blank','width=700,height=700');

}

</script>

.....

</head>

<body>

.....

<script>

readytogo()

</script>

.....

</body>

</html>

 

        Don't forget to specify the whole name of the new file, including the extension, or it won't work otherwise (i.e: your_new_file.htm).

As for the other parameters, "_blank" can be "_self" or whatever, doesn't matter, it just specify how the new page will be opened..., while the "width" and "height" are totally optional, and determine the size of the new window, if desired so.

 

 

 

 

        2.The "Called page":

 

 

    This will be a totally usual page, containing everything you want and how you want, with a little add-on: a procedure to "extract" the text from the address bar into a variable that you can use at your discretion.

 

<html>

.....

<head>

.....

<script>

var my_text = window.location.search.substring(1);

</script>

</head>

.....

</html>

 

    So you will have the my_text variable which will have stored the text you passed to this page from the previous page.

 

 

  Congratulation ! You can now pass a text between windows ! If there is something you didn't understand or anything else, just leave a comment !