By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,479 Members | 1,245 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,479 IT Pros & Developers. It's quick & easy.

onChange failing in Firefox, ok in IE

P: 4
I have a fairly basic Javascript that is taking a selected value in a select and making a div on the page visible when selected, hiding it when unselected. It works great in IE, but Firefox is not displaying anything.

Expand|Select|Wrap|Line Numbers
  1. function initSelect()
  2. {
  3.     var theSelect = document.getElementById("Affiliation");
  4.  
  5.     theSelect.changed = false;
  6.     theSelect.onfocus = selectFocussed;
  7.     theSelect.onchange = selectChanged;
  8.     theSelect.onkeydown = selectKeyed;
  9.     theSelect.onclick = selectClicked;
  10.  
  11.     return true;
  12. }
  13.  
  14.  
  15.  
  16.  
  17. function selectChanged(theElement)
  18. {
  19.     var theSelect;
  20.  
  21.     if (theElement && theElement.value)
  22.     {
  23.         theSelect = theElement;
  24.     }
  25.     else
  26.     {
  27.         theSelect = this;
  28.     }
  29.  
  30.     if (!theSelect.changed)
  31.     {
  32.         return false;
  33.         test.style.visibility = 'hidden';
  34.     }
  35.  
  36.     if (theSelect.selectedIndex == 13)
  37.     {
  38.         test.style.visibility = 'visible';
  39.     }
  40.     else
  41.     {
  42.         test.style.visibility = 'hidden';
  43.     }
  44.  
  45.     return true;
  46. }
  47.  
  48.  
  49.  
  50.  
  51. function selectClicked()
  52. {
  53.     this.changed = true;
  54. }
  55.  
  56.  
  57.  
  58.  
  59. function selectFocussed()
  60. {
  61.     this.initValue = this.value;
  62.  
  63.     return true;
  64. }
  65.  
  66.  
  67.  
  68.  
  69. function selectKeyed(e)
  70. {
  71.     var theEvent;
  72.     var keyCodeTab = "9";
  73.     var keyCodeEnter = "13";
  74.     var keyCodeEsc = "27";
  75.  
  76.     if (e)
  77.     {
  78.         theEvent = e;
  79.     }
  80.     else
  81.     {
  82.         theEvent = event;
  83.     }
  84.  
  85.     if ((theEvent.keyCode == keyCodeEnter || theEvent.keyCode == keyCodeTab) && this.value != this.initValue)
  86.     {
  87.         this.changed = true;
  88.         selectChanged(this);
  89.     }
  90.     else if (theEvent.keyCode == keyCodeEsc)
  91.     {
  92.         this.value = this.initValue;
  93.     }
  94.     else
  95.     {
  96.         this.changed = false;
  97.     }
  98.  
  99.     return true;
  100. }
  101.  
Expand|Select|Wrap|Line Numbers
  1. <select name="thename" id="selector">
  2. <option selected>0</option>
  3. <option>1</option>
  4. <option>2</option>
  5. .
  6. .
  7. .
  8. <option>13</option>
  9. </select>
  10.  
  11. <div id="test" style="visibility:hidden;">Visible in IE, not in Firefox</div>
  12.  
Any suggestions? Thanks!
Nov 29 '06 #1
Share this Question
Share on Google+
2 Replies


Expert 100+
P: 1,892
What function are you calling on your onchange event?
Nov 29 '06 #2

P: 4
I ended up finding the problem w/ Firefox's debugger. I just needed to declare the hidden DIV as a variable using getElementbyID. Once I did that, Firefox smartened up and found the DIV and, wouldn't ya know it, it worked!
Nov 30 '06 #3

Post your reply

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