469,271 Members | 1,176 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,271 developers. It's quick & easy.

Changing the text of a div

I'm trying to update a div based on the selection from a select. I've found many pages, including one on here that describes the way I am doing this is correct but it still fails.

I get the error "Object doesn't support this property or method" at the line document.getElementByID("lblDescription").firstChi ld.nodeValue = aPackageDescriptions[i]. Here is the code.

Expand|Select|Wrap|Line Numbers
  1. <script language="JavaScript">
  2. var aPackageDescriptions = new Array()
  3.  
  4. aPackageDescriptions[0] = "Rollin VIP"
  5. aPackageDescriptions[1] = "Don't be late."
  6. function ShowDescription(i)
  7. {
  8.     document.getElementByID("lblDescription").firstChild.nodeValue = aPackageDescriptions[i]
  9. }
  10.  
  11. </script>
  12.     <table>
  13.     <tr>
  14.         <th>Package Plan</th>
  15.         <td>
  16.             <select name="ddlPackagePlan" onChange="ShowDescription(ddlPackagePlan.selectedIndex)">
  17. <option value="1">Test Package</option>
  18. <option value="2">Meet me at the gate.</option>
  19.             </select>
  20.         </td>
  21.     </tr>
  22.     <tr>
  23.         <th>&nbsp;</th>
  24.         <td>
  25.             <fieldset>
  26.             <legend>Description</legend>
  27.                 <div id="lblDesciption">&nbsp;</div>
  28.             </fieldset>  
  29.     </table>
  30.  
Does anyone see something wrong with this? Any help is appreciated.
May 11 '07 #1
3 1492
<div id="lblDesciption">&nbsp;</div>
This is actually "lblDescription." It was a typo from copy-paste. Doesn't work with the correct spelling.
May 11 '07 #2
gits
5,390 Expert Mod 4TB
the following code works :) ... compare it to yours please ... there were some closing tags of td, tr missing, use 'getElementById' correct, have a look at the onChange-change ;)

Expand|Select|Wrap|Line Numbers
  1. <script language="JavaScript">
  2.     var aPackageDescriptions = new Array()
  3.  
  4.     aPackageDescriptions[0] = "Rollin VIP"
  5.     aPackageDescriptions[1] = "Don't be late."
  6.  
  7.     function ShowDescription(i) {
  8.         document.getElementById("lblDescription").firstChild.nodeValue = aPackageDescriptions[i]
  9.     }
  10. </script>
  11.  
  12. <table>
  13.     <tr>
  14.         <th>Package Plan</th>
  15.         <td>
  16.             <select name="ddlPackagePlan" 
  17.                 onChange="ShowDescription(this.selectedIndex)">
  18.                     <option value="1">Test Package</option>
  19.                     <option value="2">Meet me at the gate.</option>
  20.             </select>
  21.         </td>
  22.     </tr>
  23.     <tr>
  24.         <th>&nbsp;</th>
  25.         <td>
  26.             <fieldset>
  27.                 <legend>Description</legend>
  28.                 <div id="lblDescription">&nbsp;</div>
  29.             </fieldset>
  30.         </td>
  31.     </tr>
  32. </table>
  33.  
May 11 '07 #3
Hmm, I'm usually strict on the proper HTML... guess I missed that somehow. Thank you for the help, it works well now.
May 11 '07 #4

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

3 posts views Thread by Cengiz Ulku | last post: by
7 posts views Thread by Frostillicus | last post: by
2 posts views Thread by John Smith | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.