• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 247
  • Last Modified:

calling multiple functions

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
SirReadAlot
Asked:
SirReadAlot
  • 4
  • 2
1 Solution
 
sigmaconCommented:
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
 
SirReadAlotAuthor Commented:
it say syntax error,
0
 
SirReadAlotAuthor Commented:
and object error, i will post the codes
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
SirReadAlotAuthor Commented:
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
 
SirReadAlotAuthor Commented:
anyone ?? pls???
0
 
sigmaconCommented:
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

Featured Post

The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

  • 4
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now