Menu
Hi Guys
I want html to be inserted into my javascripts so that when the dropdown menu gets “setup” then it insert html code also. If it is possible I don’t know
Below is my javascript menu
[code]
<html>
<head>
<script type=”text/javascript”>
////////////////////////////////////////////////////////////////////////////////////////
// Cities
////////////////////////////////////////////////////////////////////////////////////////
// Name,Line1,Line2,Line3,Line4,Line5,Dell,Tel,FAX,FaxEmail,Email,Webpage
var CityCourierCost = [
[‘Please select your City’,”,”],
[‘Cape Town’,’200′,’Cape Town’],
[‘JHB’,’600′,’JHB’]
//[‘Witbank’,’amount’]
];
function SetupCity(TA) {
var str = “<select id=’City’ onchange=’CityInfo()’>”;
for (var i=0; i<CityCourierCost.length; i++) {
str += ‘<option value=”‘+CityCourierCost[i].join(‘|’)+'”>’+CityCourierCost[i][0]+'</option>’;
}
str +='</select>’;
document.write(str);
}
function CityInfo() {
var sel = document.getElementById(‘City’).selectedIndex;
var tmp = []; tmp.push(sel);
for (var i=1; i<3; i++) { tmp.push(CityCourierCost[sel][i]); }
document.getElementById(‘CourierCost’).value = tmp[1];
document.getElementById(‘CityName’).value = tmp[2];
}
</script>
</head>
<body >
<form name=”theform” action=”” method=”post”>
<table width=”863″ height=”53″>
<tr>
<td width=”90″ height=”24″>City</td>
<td width=”193″><script type=”text/javascript”>SetupCity();</script></td>
<td width=”183″>City Selected:</td>
<td width=”377″><input type=”text” name=”CityName” id=”CityName” size=”40″ value=”” ></td>
</tr>
<tr>
<td height=”21″> </td>
<td> </td>
<td>Courier Cost</td>
<td><input type=”text” name=”CityCourierCost” id=”CourierCost” size=”40″ value=”” onBlur=”startCalc();” readonly ></td>
</tr>
</table>
</form>
</body>
</html>
You see my dropdown menu gets populated with an array but as there are many items in the array (not shown in example) I want to split them with an optgroup. the html version of an optgroup looks like this
[code]
<select name=”Other City”>
<optgroup label=”Mpumalanga”>
<option value=”MP – boekenhouthoek”>boekenhouthoek</option>
<option value=”MP – carolina”>carolina</option>
<option value=”MP – embalenhle”>embalenhle</option>
<option value=”MP – emzinoni”>emzinoni</option>
<option value=”MP – ermelo”>ermelo</option>
<option value=”MP – jeppe’s reef”>jeppe’s reef</option>
</optgroup>
<optgroup label=”Mpumalanga”>
<option value=”MP – nelspruit”>nelspruit</option>
<option value=”MP – sakhile”>sakhile</option>
<option value=”MP – secunda”>secunda</option>
<option value=”MP – siyabuswa”>siyabuswa</option>
<option value=”MP – wesselton”>wesselton</option>
<option value=”MP – witbank”>witbank</option>
</optgroup>
</select>
so my problem is to make my javascript menu have optgroups
Is this possible as there are over 300 items and I want to group them
Any help would be appriaciated