1. Computer problem? Tech Support Guy is completely free -- paid for by advertisers and donations. Click here to join today! If you're new to Tech Support Guy, we highly recommend that you visit our Guide for New Members.

using a variable from a page in external script

Discussion in 'Software Development' started by derektech, Nov 6, 2007.

Thread Status:
Not open for further replies.
Advertisement
  1. derektech

    derektech Thread Starter

    Joined:
    Nov 6, 2007
    Messages:
    15
    I need to use a value defined on a webpage in an external javascript file.

    <html>
    <body>
    <script src="myscript.js"></script>


    <Script Language="JavaScript">

    var theVar = 'theValue';
    </Script>

    </body>
    </html>

    I need to be able to use theVar in the external javascript file called "myscript.js".

    The challenge is that theVar is defined after the external script is called - the order of the calls must not be changed.

    Therefore within "myscript" I have defined a function that loops until theVar has been defined in the html document.

    See below for the code I have tried to use to achieve this from "myscript.js".
    Should it work? If not can you point out where I may be going wrong?


    ====================================

    function TestVariable(){
    if(typeof theID != "undefined") {
    break;

    }
    else{
    setTimeout("TestVariable();", 300);
    }
    }

    TestVariable();
    =================

    In addition, if it is possible, I would like to use the value of the captured variable to construct a dynamic url within the external file.

    Ideas leading to a solution very much appreciated.

    cheers
     
  2. Mikrondel

    Mikrondel

    Joined:
    Jun 21, 2005
    Messages:
    43
    As far as I know,
    setTimeout("TestVariable();", 300);

    makes TestVariable get called later, in a different context. Let's assume your code gets to the setTimeout line. This line will be executed, but then execution keeps on going, to the next }, and then the last }, then the function ends and execution continues on past the
    TestVariable();
    call that started the function off.

    But, even if you end execution of the script right after setTimeout, when TestVariable gets called 300ms later, it's called by the Javascript engine, not your script. I.e. when it returns, your script won't resume, and the whole exercise is pointless.

    Furthermore, I think Javascript is single-threaded only so supposing external script is busy-looping while waiting for the inline script to define theVar, the inline script will never run.

    The question that really arises here is why you need the scripts to be executed in that order. Sure if you need the external script to do something beforehand, do so by all means, but then why not define a function in it that the inline script calls once it defines theVar?

    If you're worried about preserving variables and such, that's a significantly simpler issue and we'll help you with that if need be.
     
  3. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    You just want something like this?

    Code:
    <script id="external_example">
        function readyToGo() {
            alert(theVar);
        }
    </script>
    <script>
        var theVar = 'theValue';
    </script>
    <script>readyToGo();</script>
    
     
  4. derektech

    derektech Thread Starter

    Joined:
    Nov 6, 2007
    Messages:
    15
    thanks for the responses. Maybe I can elaborate further:

    A variable has been defined on html webpage, and I want to use this variable in an external javascript (which script is also called within the html page). However the script is called before the variable is defined on the page. But I need to use the value variable (which is only to be found on the html page) to construct a dynamic url within the external script. But I cannot do this until after the lines on the html webpage that define and assign a value to the variable have been executed.

    But since the order is that the external script is called before the lines on the html page define and assign a value to the variable, I somehow need to test and ensure that the value of the variable is present before I can use it in the external script to construct the dynamic url - otherwise an exception will be thrown if I attempted to use it in the external script.

    The code fragment on the html webpage looks like:
    ==================

    <html>
    <body>
    <script src="myscript.js"></script>


    <Script Language="JavaScript">

    var theVar = 'theValue';
    </Script>

    </body>
    </html>

    ============================

    my test in the external script to ensure theVar has been defined and assigned a value, and so can use it to construct the dynamic url looks like:

    ====================================
    //function to test the
    function TestVariable(){
    if(typeof theVar != "undefined") {
    break;

    }
    else{
    setTimeout("TestVariable();", 300);
    }
    }

    TestVariable();

    // from here construct dynamic url with the captured value in the html
    .
    .
    .
    =================
     
  5. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    mypage.html
    Code:
    <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="utf-8">
            <title></title>
            <script src="myscript.js"></script>
            <script>var theVar = "zipzambam";</script>
        </head>
        <body>
    
        </body>
    </html>
    
    myscript.js
    Code:
    var interval = setInterval(readyToGo, 1000);
    function readyToGo() {
        if (!theVar) {
            return;
        }
        clearInterval(interval);
        alert(theVar);
    }
    
     
  6. derektech

    derektech Thread Starter

    Joined:
    Nov 6, 2007
    Messages:
    15
    Should the first line be instead?

    var interval = setInterval(readyToGo(), 1000);
     
  7. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    No. The first argument to setInterval is a reference to the function to call.

    In other words, it wants to know what function to call so *it* can do readyToGo(), when it's ready.

    You can look at it this way:

    Code:
    var readyToGo = function() {
        if (!theVar) {
            return;
        }
        clearInterval(interval);
        alert(theVar);
    };
    var interval = setInterval(readyToGo, 1000);
    
     
  8. derektech

    derektech Thread Starter

    Joined:
    Nov 6, 2007
    Messages:
    15
    techguy ROCKS!!! Simply the best. My very first problem solved in no time.

    thumbs up!!!
     
  9. derektech

    derektech Thread Starter

    Joined:
    Nov 6, 2007
    Messages:
    15
    I have realised that the dynamic url needs to be within an iframe. So I tried to use document.write in the external script to write the iframe with the captured variable back into the page. When i did this, the page loading loops forever. When I viewed source there is nothing at all in it (a completely blank page source).


    if (window.theVar !="undefined")
    {
    //use the variable to construct a dynamic url
    document.write("<IFRAME SRC='someurl;value=' + theVar + '?' + 'WIDTH=200 HEIGHT=150 FRAMEBORDER=0></IFRAME>'");
    .
    .
    .

    }

    Any ideas how I should do this. Is it possible to use document.write to achieve this, or rather should I be considering some different approach?

    cheers
     
  10. Shadow2531

    Shadow2531

    Joined:
    Apr 30, 2001
    Messages:
    2,636
    Avoid document.write for this. It will actually create a new page and won't append the iframe to the current document.

    You can do it like this:
    Code:
    var readyToGo = function() {
        if (theVar && document.body) {
            clearInterval(interval);
            var iframe = document.createElement("iframe");
            iframe.setAttribute("src", "http://www.google.com/");
            iframe.setAttribute("width", "200");
            iframe.setAttribute("height", "150");
            iframe.setAttribute("frameborder", "0");
            document.body.appendChild(iframe);
        }
    };
    var interval = setInterval(readyToGo, 1000);
    
    In this case though, I'm assuming you want to append it to the end of the body. If not, you want to wait till the element you want to append to is present (along with theVar) and append to that element instead.

    If you do indeed want to wait till document.body is present and append to that, you might as well forget about the setInterval stuff and in your script just do:

    Code:
    window.onload = function() {
        // do whatever you need to.
    };
    
    , unless you have something on the page that delays the load event for a long time.
     
  11. derektech

    derektech Thread Starter

    Joined:
    Nov 6, 2007
    Messages:
    15
    Beautiful stuff.
    I am hooked to this site!!!!
     
  12. Sponsor

As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 733,556 other people just like you!

Loading...
Similar Threads - using variable page
  1. adhya.arya
    Replies:
    2
    Views:
    655
  2. des000
    Replies:
    4
    Views:
    531
Thread Status:
Not open for further replies.

Short URL to this thread: https://techguy.org/648501

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice