This code is generated from a PHP form. I’m certain something simple is awry here but the following code works in IE, but not FireFox.
[code=php]
<script language=”JavaScript”>
var aPackageNames = new Array()
var aPackageDescriptions = new Array()
var aPackagePrices = new Array()
aPackageNames[0] = ” ”
aPackageDescriptions[0] = ” ”
aPackagePrices[0] = ” ”
aPackageNames[1] = “Test Package”
aPackageDescriptions[1] = “Praesent orci sapien, faucibus eget, mattis vel, pharetra ac, ante. Suspendisse ultrices. Nulla facilisi. Quisque venenatis felis ut lectus. Praesent eu enim. Suspendisse ultricies sollicitudin tellus. Sed id velit. Integer interdum. Ut nisl tortor, congue in, volutpat at, scelerisque at, metus. Nunc convallis vehicula quam. Fusce velit mi, aliquet et, gravida sit amet, semper sit amet, tortor. Nullam accumsan tincidunt nulla. Sed lobortis urna vitae ipsum.”
aPackagePrices[1] = “125”
aPackageNames[2] = “Test Package 2”
aPackageDescriptions[2] = “Test Package”
aPackagePrices[2] = “1234”
aPackageNames[3] = “Test Package 3”
aPackageDescriptions[3] = “Test Package 3”
aPackagePrices[3] = “99.99”
aPackageNames[4] = “Test Package 4”
aPackageDescriptions[4] = “Test Package 4”
aPackagePrices[4] = “140”
aPackageNames[5] = “Test Package 5”
aPackageDescriptions[5] = “Test Package 5”
aPackagePrices[5] = “66.5”
aPackageNames[6] = “Test Package 6”
aPackageDescriptions[6] = “Test Package 6”
aPackagePrices[6] = “987.99”
function ShowDescription(i)
{
document.getElementById(‘hidPackagePlanName’).value = aPackageNames[i]
document.getElementById(‘lblDescription’).innerHTML = aPackageDescriptions[i]
document.getElementById(‘lblPrice’).innerHTML = aPackagePrices[i]
}
</script>
<body>
<form>
<table width=”500″>
<tr>
<th width=”150″>Package Plan</th>
<td align=”left” width=”350″>
<select name=”ddlPackagePlan” onChange=”ShowDescription(this.selectedIndex)”><option value=”” selected>Select a package</option><option value=”1″>Test Package</option><option value=”2″>Test Package 2</option><option value=”3″>Test Package 3</option><option value=”4″>Test Package 4</option><option value=”5″>Test Package 5</option><option value=”6″>Test Package 6</option></select><span style=”color: #ff0000;”>*</span> </td>
</tr>
<tr>
<td align=”right”>Price </td>
<td><div id=”lblPrice”> </div></td>
</tr>
<tr>
<td align=”right” valign=”top”>Description </td>
<td><div id=”lblDescription”> </div></td>
</tr>
</table>
<input type=”hidden” name=”hidPackagePlanName”>
</form>
By works I mean if you select a package from the dropdown, it should populate the “Price” and “Description” boxes accordingly.
Can anyone see what might be wrong here? I’ve tried replacing .innerHTML with .firstChild.nodeValue but that doesn’t work either. My best guess is I’m not using the properties correctly.
Thank you for your time. Any help is appreciated.