Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11
  1. #1
    Regular Coder MrBiggZ's Avatar
    Join Date
    Apr 2005
    Location
    Indianapolis IN
    Posts
    345
    Thanks
    44
    Thanked 2 Times in 2 Posts

    Question How do you include an outside file into script?

    Greetings!

    I have this script and I want to take out the part below the /////////////////////////// up to the buildMenu(); statement. I would dynamically create the menu list with php. Problem is I don't know javascript that well

    This is its own .js file not a script within the head section of the page.

    Code:
    <!--
    
    /*
    Configure menu styles below
    NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors
    */
    YOffset=150; // no quotes!!
    XOffset=0;
    staticYOffset=30; // no quotes!!
    slideSpeed=20 // no quotes!!
    waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
    menuBGColor="black";
    menuIsStatic="yes"; //this sets whether menu should stay static on the screen
    menuWidth=150; // Must be a multiple of 10! no quotes!!
    menuCols=2;
    hdrFontFamily="verdana";
    hdrFontSize="2";
    hdrFontColor="white";
    hdrBGColor="#170088";
    hdrAlign="left";
    hdrVAlign="center";
    hdrHeight="15";
    linkFontFamily="Verdana";
    linkFontSize="2";
    linkBGColor="white";
    linkOverBGColor="#FFFF99";
    linkTarget="_top";
    linkAlign="Left";
    barBGColor="#444444";
    barFontFamily="Verdana";
    barFontSize="2";
    barFontColor="white";
    barVAlign="center";
    barWidth=20; // no quotes!!
    barText="SIDE MENU"; // <IMG> tag supported. Put exact html for an image to show.
    
    ///////////////////////////
    
    // ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header
    ssmItems[0]=["Menu"] //create header
    ssmItems[1]=["Dynamic Drive", "http://www.dynamicdrive.com", ""]
    ssmItems[2]=["What's New", "http://www.dynamicdrive.com/new.htm",""]
    ssmItems[3]=["What's Hot", "http://www.dynamicdrive.com/hot.htm", ""]
    ssmItems[4]=["Message Forum", "http://www.codingforums.com", "_new"]
    ssmItems[5]=["Submit Script", "http://www.dynamicdrive.com/submitscript.htm", ""]
    ssmItems[6]=["Link to Us", "http://www.dynamicdrive.com/link.htm", ""]
    
    ssmItems[7]=["FAQ", "http://www.dynamicdrive.com/faqs.htm", "", 1, "no"] //create two column row
    ssmItems[8]=["Email", "http://www.dynamicdrive.com/contact.htm", "",1]
    
    ssmItems[9]=["External Links", "", ""] //create header
    ssmItems[10]=["JavaScript Kit", "http://www.javascriptkit.com", ""]
    ssmItems[11]=["Freewarejava", "http://www.freewarejava.com", ""]
    ssmItems[12]=["Coding Forums", "http://www.codingforums.com", ""]
    
    buildMenu();
    
    //-->
    I don't know the syntax to do something like this:

    Code:
    <!--
    
    /*
    Configure menu styles below
    NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors
    */
    YOffset=150; // no quotes!!
    XOffset=0;
    staticYOffset=30; // no quotes!!
    slideSpeed=20 // no quotes!!
    waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
    menuBGColor="black";
    menuIsStatic="yes"; //this sets whether menu should stay static on the screen
    menuWidth=150; // Must be a multiple of 10! no quotes!!
    menuCols=2;
    hdrFontFamily="verdana";
    hdrFontSize="2";
    hdrFontColor="white";
    hdrBGColor="#170088";
    hdrAlign="left";
    hdrVAlign="center";
    hdrHeight="15";
    linkFontFamily="Verdana";
    linkFontSize="2";
    linkBGColor="white";
    linkOverBGColor="#FFFF99";
    linkTarget="_top";
    linkAlign="Left";
    barBGColor="#444444";
    barFontFamily="Verdana";
    barFontSize="2";
    barFontColor="white";
    barVAlign="center";
    barWidth=20; // no quotes!!
    barText="SIDE MENU"; // <IMG> tag supported. Put exact html for an image to show.
    
    ///////////////////////////
    
    // ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header
    
    include menu-file
    
    buildMenu();
    
    //-->
    Not really sure how to go about this
    Thanks for any help in advance!

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    You can't have a ".js" file include another ".js" file (or equivalent), but you don't need to.

    Just have your *MAIN* page build the array *BEFORE* you include the ".js" file! (After removing the lines you indicated, of course.)

    So your main (presumably PHP) page would do:
    Code:
    <html>
    <head>
    <script type="text/javascript">
    var ssmItems = [
    <?php
    // ... php loop that generates the menu items ... such as ...
    $delim = ""; // delimiter is blank on first line
    while ( whatever )
    {
        echo $delim . "[\"$name\",\"$url\",\"\"]\n";
        $delim = ","; // change delimiter to a comma
        ...
    }
    ... 
    ?>
      ]; // end of the js array
    </script>
    <script type="text/javascript" src="thatFileYouShowed.js"></script>
    ...
    The idea is to have your PHP page, when you look at the source code it produces in the browser, end up with HTML of the form[code]
    Code:
    <html>
    <head>
    <script type="text/javascript">
    var ssmItems = [
        ["Home","/home.php",""]
        ,["Pictures","/pix.php",""]
        ,["About Me","/about.php",""]
      ]; // end of the js array
    </script>
    Okay?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    MrBiggZ (06-16-2010)

  • #3
    Regular Coder MrBiggZ's Avatar
    Join Date
    Apr 2005
    Location
    Indianapolis IN
    Posts
    345
    Thanks
    44
    Thanked 2 Times in 2 Posts
    Thanks Old Pedant!!!

    I didn't realize you could do that! Huh, so you can declare the array in javascript and use it in another script in the head section.

    That's the third thing I learned today! 1st thing was that I still can dodge rain drops ... even when I'm turned sideways!

    Much thanks again!

  • #4
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    You need to understand that there is *NO DIFFERENCE* in how the code is executed, regardless of whether you put it inline in your HTML page:
    Code:
    <script type="text/javascript">
    var foo = 37;
    function bar( )
    {
        alert(foo);
    }
    </script>
    or you put it into an external JS file:
    Code:
    <script type="text/javascript" src="zamboni.js"></script>
    Essentially, when you put it into the external JS file, that just tells the browser to go grab the *source code* from that external file and copy/paste it in place into the web page.

    So there's no difference between initializing a variable inline or initializing it in the external file.

    NOW...

    *IF* the variable is DECLARED *inside a function*, then the variable is *only* "visible" inside that same function. But that would be true whether the function was coded inline or in the external file.

    That is, of course, *not* the case here: In fact, that code was *designed* to be used with a variable that is declared at page scope (that is, outside of any function) and, I think, the author should have made that clear by either using two separate external files or by showing and example coded as I did, with the the variable in the main page.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #5
    Regular Coder
    Join Date
    Dec 2009
    Posts
    115
    Thanks
    2
    Thanked 10 Times in 10 Posts
    Quote Originally Posted by Old Pedant View Post
    You can't have a ".js" file include another ".js" file (or equivalent), but you don't need to.

    Just have your *MAIN* page build the array *BEFORE* you include the ".js" file! (After removing the lines you indicated, of course.)

    So your main (presumably PHP) page would do:
    Code:
    <html>
    <head>
    <script type="text/javascript">
    var ssmItems = [
    <?php
    // ... php loop that generates the menu items ... such as ...
    $delim = ""; // delimiter is blank on first line
    while ( whatever )
    {
        echo $delim . "[\"$name\",\"$url\",\"\"]\n";
        $delim = ","; // change delimiter to a comma
        ...
    }
    ... 
    ?>
      ]; // end of the js array
    </script>
    <script type="text/javascript" src="thatFileYouShowed.js"></script>
    ...
    Okay?
    Using PHP to write JavaScript? I can't believe I never thought of that before. Wonder if I'll ever find a use for that.

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    I can't imagine writing really useful web pages *without* doing so.

    (Don't mean every page, of course, but at least some pages in any set of pages would need to do so.)

    Just some examples:
    -- creating dependent <select>s. example: countries, states, cities. Use PHP/ASP/JSP to create JS that changes which states appear for a given country and the which cities for a given state, where you are reading a database of that info.

    -- creating slideshows of images, where you get the list of available images from either finding all files in a directory or (again) from a database.

    -- creating click-on locations on a google map, based on latitude/longitude table in (what else?) a database.

    And many many more.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #7
    Regular Coder
    Join Date
    Dec 2009
    Posts
    115
    Thanks
    2
    Thanked 10 Times in 10 Posts
    Isn't that more of an AJAX thing using XMLHttpRequest that you're talking about there? I was specifically talking about actually writing the portions of non-AJAX applications within the <script> tags using PHP, or was that what you were talking about?
    Last edited by Dean440; 06-17-2010 at 01:15 AM.

  • #8
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    ??? I can't see any reason to use AJAX for any of those.

    Oh, you *MIGHT* want to use AJAX for the first one, *IF* the number of <option> values possible for that last <select> is quite large (e.g., if you had 10 countries and 400 states, you'd certainly do that without AJAX, but you *might* opt to use AJAX for the cities if you had 8,000 cities). But I wouldn't bother with the mess of AJAX if I had no more than, say, 2000 cities all total.

    And I certainly woud never use AJAX in the other two situations. Makes no sense. Why add overhead for no reason?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #9
    Regular Coder hdewantara's Avatar
    Join Date
    Aug 2009
    Location
    Jakarta, Indonesia.
    Posts
    376
    Thanks
    9
    Thanked 55 Times in 54 Posts
    Hi,
    Quote Originally Posted by Old Pedant View Post
    You can't have a ".js" file include another ".js" file (or equivalent), but you don't need to...
    A bit far from topic if I may,
    wonder whether we could do that via document.createElement("script") ?

    Say we have lib1.js as follows:
    PHP Code:
    var
      
    libs document.getElementsByTagName("script");
      
    lib2 document.createElement("script");
      
    lib2.type="text/javascript";
      
    lib2.src="lib2.js";

    // but which line below is more appropriate to insert the new lib
    // as part of document?
    libs[0].parentNode.insertBefore(lib2,libs[libs.length-1]);
    //libs[0].parentNode.appendChild(lib2);
    //document.getElementsByTagName("head")[0].appendChild(lib2);
    ... 

  • #10
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,700
    Thanks
    80
    Thanked 4,658 Times in 4,620 Posts
    Yeah, there's always a way around a limitation. But certainly overkill for the current instance, no?
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #11
    Regular Coder hdewantara's Avatar
    Join Date
    Aug 2009
    Location
    Jakarta, Indonesia.
    Posts
    376
    Thanks
    9
    Thanked 55 Times in 54 Posts
    Possibly, or ...
    I don't know, to be precise .

    I have never applied that idea (yet) to real applications,
    but just on my own PC.

    Maybe that's why popular jquery's fancybox always requires
    at least 2 script include files: the core jquery and fancybox pack itself,
    not just fancybox.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •