View Full Version : Dynamically creating hyperlinks

07-02-2005, 12:25 PM
I am creating a pop-up menu/submenu thingy by using a function to read from an array containing info on the submenus, and dynamically attaching a div containing submenu hyperlinks to the menu item. Make sense?

All is working fine except that the hyperlinks don't work (OK i guess that's not working fine at all). The menu pops up with the right items, and the status bar shows the right urls for the submenus, but they dont take you to the link. However right-clicking on a submenu and opening in new window does. Confusing. Also I have defined an a:hover class in the stylesheet which the submenus dont respond to. So are they hyperlinks or aren't they? And how do I get them to follow the link, and display as they should on hover? Anyway, let's see some code:

function addMenu(id)
//function for creating submenu div
var mainMenu = document.getElementById(id);
var subMenu = document.createElement("<div id='mycatSubMenu' class='subMenu'>");
var sublist = cats[id];
//for each subcat
//create link
//set href
//set inner text
//add to sub
var count = sublist.length;
for(i=0; i<count;i++){
var link = document.createElement('a');
// link.href= '/products/category.php?catid='+count;



Here's the html showing the main menu items

<div id="223" style="position:relative" onmouseover="addMenu(id)"><a name="Accounting Book/Pa..." href="../products/category.php?catid=223">&nbsp;<&nbsp;Accounting Book/Pa...</a></div>
<div id="224" style="position:relative" onmouseover="addMenu(id)">
<a name="Adhesives" href="../products/category.php?catid=224">&nbsp;<&nbsp;Adhesives</a></div>
<div id="136" style="position:relative" onmouseover="addMenu(id)">
<a name="Air Care Germokill" href="../products/category.php?catid=136">&nbsp;<&nbsp;Air Care Germokill</a></div>
<div id="183" style="position:relative" onmouseover="addMenu(id)">
<a name="Air Conditioners" href="../products/category.php?catid=183">&nbsp;<&nbsp;Air Conditioners</a></div>

And here's the array containing the submenu information:

<script>var cats = new Array();
cats[195] = new Array('Chemical Absorbents','General Purpose Absorbents','Oil Only Absorbents','Spill Kits');
cats[223] = new Array('Analysis ruled pad','Analysis ruled paper','General Trader/VAT book','Halfbound account book','Postage & Delivery book','Standard account book','Standard Analysis Book','Wage & S.S.P book');
cats[224] = new Array('All Purpose adhesive','Dry adhesive','Glue Roller/Refill','Glue Stick/Gluepen','Paste/Smooth');
cats[136] = new Array('Air Purifiers (Germokill)');
cats[183] = new Array('Air Conditioners','Air free Air Purifier');

Willy Duitt
07-04-2005, 09:18 PM

07-05-2005, 09:51 AM
take care that you are dealing with a 2'nd array. cats is a 2'nd array. On the other hand to pass the self id of an element you must use the this self refereence. Ant third... id, as all the values, is a string, but the index of an array's element is a number

so that (even I am not sure what is your intention) I guess that you must have something like:

function addMenu(id){
var id = Number(id);



<div id="223" style="position:relative" onmouseover="addMenu(this.id)">