script working in IE but not Firefox

[Jim Burgess]

I am trying to get a portion of javascript to work in Firefox that works perfectly in I.E.

In this first section of code, I have a drop down box that when the value is changed to 29 (Other), it should show an input box. When the value does not equal 29, it should hide the box (for experiment purpose, I don't have it hiding upon load, but will make that happen when the script is fixed).

I can't get this to work in FireFox.

  <html>  
  <head>  
  <title>getElementById example</title>  
  <script language="JavaScript"> 
    function JTOther_Toggle(itemID){
      var othval = 29;
      var JTitle = document.getElementById("JTTitle1");
      var JInput = document.getElementById("JTInput1");
      if (othval == this.sysForm.JobFunctionId.value)
         {JTitle.style.display = 'inline'; 
          JInput.style.display = 'inline';}  
      else
         {JTitle.style.display = 'none'; 
          JInput.style.display = 'none';} } 
  </script>
  </head>  
  <body>  
  <form action="user_action.htm" method="POST" name="sysForm" id="sysForm" onsubmit="return Validate(this.form)">
    <div id="JobTitleDD">
      Job Title:  
      <select name="JobFunctionId" id="JobFunctionId" size="1" onchange="JTOther_Toggle(this.value);">
        <option value="0" selected="YES">No Title Selected</option>
        <option value="25">Director</option>
        <option value="29">Other</option>
        <option value="3">President</option>
      </select>
    </div>
    <div id="JTTitle1">Other Title:</div>
    <div id="JTInput1">
      <input type="Text" name="JTOther" value="" size="30" maxlength="75" id="JTOther">
    </div>
  </form>
</body>  
</html>

So while experimenting, I found the below sample which is very similar to the one above. It works just fine in both browsers.

  <html>  
  <head>  
  <title>getElementById example</title>  
  <script type="text/javascript">  
    function changeShow(myvalue) {  
     var elem = document.getElementById("para1");  
     elem.style.display = 'inline'; }  
  function changeHide(myvalue) {  
   var elem = document.getElementById("para1");  
   elem.style.display = 'none'; }  
  </script>  
  </head>  
  <body>  
    
  <p id="para1">Display some text here</p>
  <br><br>  
  <button onclick="changeShow('show');">Show</button>  
  <button onclick="changeHide('hide');">Hide</button>  
</body>  
</html>

Can someone help me understand what I am missing to get the first option to work in FireFox?

THANKS!

[Dormilich]

the second code is somewhat problematic.

- would you put that into a <form>, you’d get a form submission
- you don’t use the parameters passed.

the first code has a similar problem, you pass the currently selected value, but you never use that.

try

if (29 == itemID) {

[JKing]

Misread what has already been said, making my post irrelevant. Go with dormlich's suggestion.