...

View Full Version : Error when trying to show information from a dropdown menu



ChIcO
12-19-2007, 07:59 PM
Hello everyone,

First of all, I'm sorry if this is an obvious problem because I'm relatively new to coding in general. What I'm trying to do is to show information regarding a selected drop down. For example, if I choose option A, a message will appear under the drop down menu explaining what is option A. I found a nice script that does exactly what I want. It works great in a blank page but when I try to add it to my code I get the following error: document.getElementById(...) is null or not an object for this line

document.getElementById(container).innerHTML=descriptionarray[which.selectedIndex]

Here's my code:



<html>
<body>
<table border="0" cellspacing="0" cellpadding="0" height="92">
<tr>
<td width="100"></td>
<td height="404" valign="top">

</font>

<form name="form1" method="post" >
<input type="hidden" name="withRefresh" value="0">

<h4><font face="Arial, Helvetica, sans-serif" color="#336600">Request:</font></h4>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><font face="Arial, Helvetica, sans-serif" size="2"><b>Priority:</b></font></td>
<td>
<select name="requestPty" size="1" onChange="displaydesc(document.form1.requestPty, text,

'PriorityInfo')">
<option name="0" value="test" SELECTED >Choose</option>
<option name=1 value="test2">A=Production Down</option>
<option name=2 value="test3">B=High</option>
<option name=3 value="test4">C=Medium</option>
<option name=4 value="test5">D=Low</option>
<option name=5 value="test6">E=Improvement</option>

<br>
<span id="PriorityInfo" align="left" style="font:italic">
</span>
</td>
</tr>
</table>
</form>
</td>
</tr>
</table>

<script type="text/javascript">

var text=new Array()
text[0]="Please select a priority."
text[1]="Your production is down."
text[2]="This is a high priority."
text[3]="This is a medium priority."
text[4]="This is a low priority."
text[5]="This is an improvement."

function displaydesc(which, descriptionarray, container){
if (document.getElementById)
document.getElementById(container).innerHTML=descriptionarray[which.selectedIndex]
}

displaydesc(document.form1.requestPty, text, 'PriorityInfo')

</script>

* : required information
<br>
<input type="button" name="button" value="Submit" onclick="checkEntry()">
<INPUT TYPE="button" NAME="Cancel" VALUE="Cancel" onClick='cancelReq()'>
<hr>

<FORM NAME="changLang" ACTION = "changeLang.jsp" METHOD = "post" ENCODE="application/x-www-form-urlencoded">
<input type="hidden" name="language" value="fr">
<input type="hidden" name="targetPage" value="supportPbForm.jsp">
<input type="hidden" name="reloadInfo" value="1">
</form>
</td>
</tr>
</table>
</body>
</html>

Here's the code I found:


<!--Example drop down menu 1-->

<form name="form1">
<select name="requestPty" size="1" style="background-color:#FFFFD7"

onChange="displaydesc(document.form1.requestPty, thetext1, 'PriorityInfo')">
<option selected value="http://www.javascriptkit.com">JavaScript Kit </option>
<option value="http://freewarejava.com">Freewarejava.com</option>
<option value="http://wired.com" target="newwin">Wired News</option>
<option value="http://www.news.com">News.com</option>
<option value="http://www.codingforums.com" target="newwin">Coding Forums</option>
<option value="http://www.codingforums.com" target="newwin">Coding Forums</option>
</select>
<br>
<span id="PriorityInfo" align="left" style="font:italic 13px Arial">
</span>
</form>

<!--IMPORTANT: Below script should always follow all of your HTML codes above, and never proceed them-->
<!--To be safe, just add below script at the end of your page-->

<script type="text/javascript">


//CUSTOMIZE TEXT DESCRIPTIONS FOR LINKS ABOVE
var thetext1=new Array()
thetext1[0]="Please select a priority."
thetext1[1]="Your production is down."
thetext1[2]="This is a high priority."
thetext1[3]="This is a medium priority."
thetext1[4]="This is a low priority."
thetext1[5]="This is an improvement."

// Now, see 2) below for final customization step

function displaydesc(which, descriptionarray, container){
if (document.getElementById)
document.getElementById(container).innerHTML=descriptionarray[which.selectedIndex]
}


//2) Call function displaydesc() for each drop down menu you have on the page
// This function displays the initial description for the selected menu item
// displaydesc(name of select menu, name of corresponding text array, ID of SPAN container tag)

displaydesc(document.form1.requestPty, thetext1, 'PriorityInfo')

</script>

Nothing shows at all with my code :( Any ideas?

ChIcO
12-20-2007, 02:18 PM
Anyone? please :) Any clarification I should add?

Arty Effem
12-20-2007, 04:28 PM
Anyone? please :) Any clarification I should add?You have a missing </select> tag which prevents the containing span from being rendered/detected. Also your stylesheet should read font-style:italic

ChIcO
12-20-2007, 04:48 PM
Thanks a lot...that was indeed a ridiculous error :(



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum