Solved

calling multiple functions

Posted on 2004-10-22
235 Views
Last Modified: 2008-02-01
Morning happy people!!! I have got a question
How do i call these two functions.

onLoad="writeMenus()"
onResize="if (isNS4) nsResizeHandler()"

In the orignal code this is how i called them
<body MS_POSITIONING="GridLayout" marginwidth="0" marginheight="0" style="MARGIN: 0px"
            onLoad="writeMenus()" onResize="if (isNS4) nsResizeHandler()">

when these functions load it fills this table=======

<table bgcolor="#006666" width="100%" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                              <td height="20"><font size="1"> </font>
                              </td>
                        </tr>
                  </table>
===================================================================
but i have moved the files to another location and
I have successful created the javascript as an external file (<script language="javascript" src="HeaderMenu.js"></script>).

But am stuck at the point where I need to call the functions and fill the entire table. do you need the actual javascript codes??
Pls help

thanks in advance

SirReadAlot
      
0
Question by:SirReadAlot
    6 Comments
     
    LVL 8

    Expert Comment

    by:sigmacon
    Are you saying now the event handlers are not called anymore as you expected? If that's the case, maybe the Javascript file cannot be loaded. Do you get any kind of feedback/message from your browser (maybe in the status bar?). Try this for debugging: .... onload="alert(writeMenus)" .... if you get a message saying 'undefined' or 'null' or something else but object or the source code of the function, then this function cannot be found - most like due to the external javascript not loaded properly. If this suggestions doesn't help, you probably will need to post some more code.
    0
     

    Author Comment

    by:SirReadAlot
    it say syntax error,
    0
     

    Author Comment

    by:SirReadAlot
    and object error, i will post the codes
    0
     

    Author Comment

    by:SirReadAlot
    this is what i have in headermenu.js
    ==================================
    <!-- The Start is more important than the Beginning or End
    var isDOM = (document.getElementById ? true : false);
    var isIE4 = ((document.all && !isDOM) ? true : false);
    var isNS4 = (document.layers ? true : false);
    function getRef(id) {
    if (isDOM) return document.getElementById(id);
    if (isIE4) return document.all[id];
    if (isNS4) return document.layers[id];
    }
    function getSty(id) {
    return (isNS4 ? getRef(id) : getRef(id).style);
    }
    // Hide timeout.
    var popTimer = 0;
    // Array showing highlighted menu items.
    var litNow = new Array();

    function popOver(menuNum, itemNum) {
    clearTimeout(popTimer);
    hideAllBut(menuNum);
    litNow = getTree(menuNum, itemNum);
    changeCol(litNow, true);
    targetNum = menu[menuNum][itemNum].target;
    if (targetNum > 0) {
    thisX = parseInt(menu[menuNum][0].ref.left) + parseInt(menu[menuNum][itemNum].ref.left);
    thisY = parseInt(menu[menuNum][0].ref.top) + parseInt(menu[menuNum][itemNum].ref.top);
    with (menu[targetNum][0].ref) {
    left = parseInt(thisX + menu[targetNum][0].x);
    top = parseInt(thisY + menu[targetNum][0].y);
    visibility = 'visible';
          }
       }
    }
    function popOut(menuNum, itemNum) {
    if ((menuNum == 0) && !menu[menuNum][itemNum].target)
    hideAllBut(0)
    else
    popTimer = setTimeout('hideAllBut(0)', 500);
    }
    function getTree(menuNum, itemNum) {

    // Array index is the menu number. The contents are null (if that menu is not a parent)
    // or the item number in that menu that is an ancestor (to light it up).
    itemArray = new Array(menu.length);

    while(1) {
    itemArray[menuNum] = itemNum;
    // If we've reached the top of the hierarchy, return.
    if (menuNum == 0) return itemArray;
    itemNum = menu[menuNum][0].parentItem;
    menuNum = menu[menuNum][0].parentMenu;
       }
    }

    // Pass an array and a boolean to specify colour change, true = over colour.
    function changeCol(changeArray, isOver) {
    for (menuCount = 0; menuCount < changeArray.length; menuCount++) {
    if (changeArray[menuCount]) {
    newCol = isOver ? menu[menuCount][0].overCol : menu[menuCount][0].backCol;
    // Change the colours of the div/layer background.
    with (menu[menuCount][changeArray[menuCount]].ref) {
    if (isNS4) bgColor = newCol;
    else backgroundColor = newCol;
             }
          }
       }
    }
    function hideAllBut(menuNum) {
    var keepMenus = getTree(menuNum, 1);
    for (count = 0; count < menu.length; count++)
    if (!keepMenus[count])
    menu[count][0].ref.visibility = 'hidden';
    changeCol(litNow, false);
    }

    // *** MENU CONSTRUCTION FUNCTIONS ***

    function Menu(isVert, popInd, x, y, width, overCol, backCol, borderClass, textClass) {
    // True or false - a vertical menu?
    this.isVert = isVert;
    // The popout indicator used (if any) for this menu.
    this.popInd = popInd
    // Position and size settings.
    this.x = x;
    this.y = y;
    this.width = width;
    // Colours of menu and items.
    this.overCol = overCol;
    this.backCol = backCol;
    // The stylesheet class used for item borders and the text within items.
    this.borderClass = borderClass;
    this.textClass = textClass;
    // Parent menu and item numbers, indexed later.
    this.parentMenu = null;
    this.parentItem = null;
    // Reference to the object's style properties (set later).
    this.ref = null;
    }

    function Item(text, href, frame, length, spacing, target) {
    this.text = text;
    this.href = href;
    this.frame = frame;
    this.length = length;
    this.spacing = spacing;
    this.target = target;
    // Reference to the object's style properties (set later).
    this.ref = null;
    }

    function writeMenus() {
    if (!isDOM && !isIE4 && !isNS4) return;

    for (currMenu = 0; currMenu < menu.length; currMenu++) with (menu[currMenu][0]) {
    // Variable for holding HTML for items and positions of next item.
    var str = '', itemX = 0, itemY = 0;

    // Remember, items start from 1 in the array (0 is menu object itself, above).
    // Also use properties of each item nested in the other with() for construction.
    for (currItem = 1; currItem < menu[currMenu].length; currItem++) with (menu[currMenu][currItem]) {
    var itemID = 'menu' + currMenu + 'item' + currItem;

    // The width and height of the menu item - dependent on orientation!
    var w = (isVert ? width : length);
    var h = (isVert ? length : width);

    // the width must be a miniumum of 3 for it to work in that browser.
    if (isDOM || isIE4) {
    str += '<div id="' + itemID + '" style="position: absolute; left: ' + itemX + '; top: ' + itemY + '; width: ' + w + '; height: ' + h + '; visibility: inherit; ';
    if (backCol) str += 'background: ' + backCol + '; ';
    str += '" ';
    }
    if (isNS4) {
    str += '<layer id="' + itemID + '" left="' + itemX + '" top="' + itemY + '" width="' +  w + '" height="' + h + '" visibility="inherit" ';
    if (backCol) str += 'bgcolor="' + backCol + '" ';
    }
    if (borderClass) str += 'class="' + borderClass + '" ';

    // Add mouseover handlers and finish div/layer.
    str += 'onMouseOver="popOver(' + currMenu + ',' + currItem + ')" onMouseOut="popOut(' + currMenu + ',' + currItem + ')">';
    //str += 'onMouseOver="popOver(\'' + currMenu + '\',\'' + currItem + '\')" onMouseOut="popOut(\'' + currMenu + '\',\'' + currItem + '\')">';

    // Add contents of item (default: table with link inside).
    // If a target frame is specified, also add that to the <a> tag.

    str += '<table width="' + (w - 8) + '" border="0" cellspacing="0" cellpadding="' + (!isNS4 && borderClass ? 3 : 0) + '"><tr><td align="left" height="' + (h - 7) + '">' + '<a class="' + textClass + '" href="' + href + '"' + (frame ? ' target="' + frame + '">' : '>') + text + '</a></td>';
    if (target > 0) {

    // Set target's parents to this menu item.
    menu[target][0].parentMenu = currMenu;
    menu[target][0].parentItem = currItem;

    // Add a popout indicator.
    if (popInd) str += '<td class="' + textClass + '" align="right">' + popInd + '</td>';
    }
    str += '</tr></table>' + (isNS4 ? '</layer>' : '</div>');
    if (isVert) itemY += length + spacing;
    else itemX += length + spacing;
    }
    if (isDOM) {
    var newDiv = document.createElement('div');
    document.getElementsByTagName('body').item(0).appendChild(newDiv);
    newDiv.innerHTML = str;
    ref = newDiv.style;
    ref.position = 'absolute';
    ref.visibility = 'hidden';
    }

    // Insert a div tag to the end of the BODY with menu HTML in place for IE4.
    if (isIE4) {
    document.body.insertAdjacentHTML('beforeEnd', '<div id="menu' + currMenu + 'div" ' + 'style="position: absolute; visibility: hidden">' + str + '</div>');
    ref = getSty('menu' + currMenu + 'div');
    }

    // In NS4, create a reference to a new layer and write the items to it.
    if (isNS4) {
    ref = new Layer(0);
    ref.document.write(str);
    ref.document.close();
    }

    for (currItem = 1; currItem < menu[currMenu].length; currItem++) {
    itemName = 'menu' + currMenu + 'item' + currItem;
    if (isDOM || isIE4) menu[currMenu][currItem].ref = getSty(itemName);
    if (isNS4) menu[currMenu][currItem].ref = ref.document[itemName];
       }
    }
    with(menu[0][0]) {
    ref.left = x;
    ref.top = y;
    ref.visibility = 'visible';
       }
    }

    // Syntaxes: *** START EDITING HERE, READ THIS SECTION CAREFULLY! ***
    //
    // menu[menuNumber][0] = new Menu(Vertical menu? (true/false), 'popout indicator', left, top,
    // width, 'mouseover colour', 'background colour', 'border stylesheet', 'text stylesheet');
    //
    // Left and Top are measured on-the-fly relative to the top-left corner of its trigger, or
    // for the root menu, the top-left corner of the page.
    //
    // menu[menuNumber][itemNumber] = new Item('Text', 'URL', 'target frame', length of menu item,
    //  additional spacing to next menu item, number of target menu to popout);
    //
    // If no target menu (popout) is desired, set it to 0. Likewise, if your site does not use
    // frames, pass an empty string as a frame target.
    //
    // Something that needs explaining - the Vertical Menu setup. You can see most menus below
    // are 'true', that is they are vertical, except for the first root menu. The 'length' and
    // 'width' of an item depends on its orientation -- length is how long the item runs for in
    // the direction of the menu, and width is the lateral dimension of the menu. Just look at

    var menu = new Array();

    // Default colours passed to most menu constructors (just passed to functions, not
    // a global variable - makes things easier to change later in bulk).
    var defOver = '#ff3366', defBack = '#ffffff';

    // Default 'length' of menu items - item height if menu is vertical, width if horizontal.
    var defLength = 22;

    // Menu 0 is the special, 'root' menu from which everything else arises.
    menu[0] = new Array();
    // A non-vertical menu with a few different colours and no popout indicator, as an example.
    // *** MOVE ROOT MENU AROUND HERE ***  it's positioned at (5, 0) and is 17px high now.
    menu[0][0] = new Menu(false, '', 5, 0, 17, '#669999', '#ffffff', '', 'itemText');
    // The 'length' of each of these items is 40, and there is spacing of  38 or 30 to the next item.
    // Most of the links are set to '#' hashes, make sure you change them to actual files.
    menu[0][1] = new Item('Employees', '#', '', 40, 38, 1);
    menu[0][2] = new Item('Receipts',  '#', '', 40, 30, 2);
    menu[0][3] = new Item('Claims',  '#', '', 40, 30, 3);
    menu[0][4] = new Item(' Notes  ',  '#', '_new', 40, 30, 0);

    // Employee menu.
    menu[1] = new Array();
    // The Employee menu is positioned 0px across and 22 down from its trigger, and is 120 wide.
    // All text in this menu has the stylesheet class 'item' -- see the <style> section above.
    // FOR POP UP----I've passed a 'greater-than' sign '>' as a popout indicator.
    menu[1][0] = new Menu(true, '>', 0, 22, 120, defOver, defBack, 'itemBorder', 'itemText');
    menu[1][1] = new Item('Add Employees', 'Admin.aspx', '_new', defLength, 0, 0);
    menu[1][2] = new Item('Update Employees', 'AminEdit.aspx', '', defLength, 0, 0);
    // Non-zero target means this will trigger a popout -- I have disabled it here,
    //change to menu[4] to make it pop out which is the 'Search' menu.
    menu[1][3] = new Item('Search', 'Search.aspx', '', defLength, 0, 0);
    menu[1][4] = new Item('Exit', 'HomePage.aspx', '', defLength, 0, 0);

    // Receipt menu.
    menu[2] = new Array();
    menu[2][0] = new Menu(true, '>', 0, 22, 120, defOver, defBack, 'itemBorder', 'itemText');
    menu[2][1] = new Item('Add Receipt', '../../webpages/Receipt.aspx', '', defLength, 0, 0);
    menu[2][2] = new Item('Update Receipt', '../../webpages/Receipt.aspx', '', defLength, 0, 0);
    menu[2][3] = new Item('Search', '#', '', defLength, 0, 0);

    // Expenses menu
    menu[3] = new Array();
    menu[3][0] = new Menu(true, '>', 0, 22, 120, defOver, defBack, 'itemBorder', 'itemText');
    menu[3][1] = new Item('Add Claim', '#', '', defLength, 0, 0);
    menu[3][2] = new Item('Update Claim', '#', '', defLength, 0, 0);
    menu[3][3] = new Item('Search', '#', '', defLength, 0, 0);



    // These two lines handle the window resize bug in NS4. If uses NS4 See <body onResize="...">.
    // leave this here as otherwise when you resize NS4's width menus are hidden.

    var popOldWidth = window.innerWidth;
    nsResizeHandler = new Function('if (popOldWidth != window.innerWidth) location.reload()');


    // This is a quick snippet that captures all clicks on the document and hides the menus
    // every time you click.

    if (isNS4) document.captureEvents(Event.CLICK);
    document.onclick = clickHandle;

    function clickHandle(evt)
    {
     if (isNS4) document.routeEvent(evt);
     hideAllBut(0);
    }


    // This is just the moving command for the menus.

    function moveRoot()
    {
     with(menu[0][0].ref) left = ((parseInt(left) < 100) ? 100 : 5);
    }
    //  End -->
          </SCRIPT>


    =====================================
    0
     

    Author Comment

    by:SirReadAlot
    anyone ?? pls???
    0
     
    LVL 8

    Accepted Solution

    by:
    If this:

         <!-- The Start is more important than the Beginning or End

    and this:

          </SCRIPT>

    is part of your .js file, than that file will most likely not be parsed properly and the functions you are trying to call are not available. The test I described earlier will tell you. Have you tried it yet? Please post your results and any error message the browser might display. If you are using Internet Explorere, it might silently eat the parsing error. Look for the little warning sign in the lower left corner when you load the page. Firefox with the JavaScript console on or Safari in debugging mode may help wonders here to pinpoint the problem. I have not looked at your code in detail. I will do so if we get the obvious stuff out of the way and you still have troubles.
    0

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Cisco Complete Network Certification Training

    If you’re an IT engineer or technician, it's time you take your career to the next level. This elite training bundle is brimming with all of the information you need to learn to sit for Cisco CNNA, CCNP, and CCENT certification exams.

    I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
    This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
    The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

    856 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    11 Experts available now in Live!

    Get 1:1 Help Now