Adding javascript to select element won't work on Firefox browser.

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • tjc0ol
    New Member
    • Nov 2007
    • 26

    Adding javascript to select element won't work on Firefox browser.

    Hi all,
    I made contact page which allows visitors to input their name, email address, phone number, comments and select a comment type by using <select> element in html with javascript. Among the option of it are: General Support, Technical Support, Sales in billing, Request RA no. and Others. If they select Others there will be a pop-up textbox for others(so they can specify a comment type) and the textbox is placed on a DIV. I placed CSS on it in which the Visibility is set to "hidden" and put an ID to the DIV which is equivalent to <div id="oh">.
    The problem is that the script won't work on FireFox but it will work on IE7, IE6, Safari & Opera browsers.

    How to make it work on FireFox browsers?

    Here's my html and javascript code below:

    [HTML]
    <form name="cont" action="feedbac k.php" method="post">
    <fieldset>
    <legend class="ledgende r">Contact US</legend>
    <table border="0" cellpadding="8" cellspacing="8" summary="feedba ck form" align="center">
    <tr><td>Name: </td><td ><input type="text" name="name" size="37" /></td></tr>
    <tr><td>Email address:</td><td ><input type="text" name="email" size="37" /></td></tr>
    <tr><td>Telepho ne No.:</td><td ><input name="telno" type="text" size="37" /></td></tr>
    <tr><td>Comme nt Type:</td>
    <td >
    <select name="attn" onchange="disab le_enable()">
    <option value=" General Support ">General Support</option>
    <option value=" Technical Support ">Technical Support</option>
    <option value=" Sales In Billing ">Sales In Billing</option>
    <option value=" Request Return Authorization (RA) No. ">Request Return Authorization (RA) No.</option>
    <option value=" Others ">Others</option> </select></td></tr>
    <tr><td class="txt-centre" colspan="2">
    <div id="oh"><strong >Others: </strong><input name="anothers" type="text" size="37" disabled="disab led" /></div></td></tr>
    <tr>
    <td colspan="2">
    Comments<br />
    <textarea rows="15" cols="55" name="comments" ></textarea>
    </td></tr>
    <tr><td align="center" colspan="2">
    <input type="submit" value="Send Feedback" />
    </td>
    </tr>
    </table>
    </fieldset>
    </form>
    [/HTML]


    Code:
    <script type="text/javascript">
    <!--
    function disable_enable(){
    if (document.cont.attn.options[document.cont.attn.selectedIndex].text=="Others"){
    document.cont.anothers.disabled=false;
    oh.style.visibility='visible';
    }
    else
       {				
     document.cont.anothers.disabled=true;
     document.cont.anothers.value='';
     oh.style.visibility='hidden';
       }
    }
    //-->
    </script>
    Thanks in advance. -tj
  • Gulzor
    New Member
    • Jul 2008
    • 27

    #2
    try to initialize js var "oh" first :

    [CODE=javascript]var oh = document.getEle mentById("oh");[/CODE]

    then

    [CODE=javascript]oh.style.visibi lity = "hidden"; // or "visible"[/CODE]
    Last edited by gits; Jul 24 '08, 11:18 AM. Reason: added code tags

    Comment

    • maminx
      New Member
      • Jul 2008
      • 77

      #3
      To make sure, try to make the
      alert("enter");

      right after the function, to make sure whether the function being called or not.
      If the problem is that you can't enter the function disable_enable( ) in Firefox, change your HTML select command like this below :

      [HTML] <select name="attn" onchange="javas cript:disable_e nable();">
      [/HTML]
      or

      [HTML] <select name="attn" onchange="retur n disable_enable( );">[/HTML]


      best regards,

      maminx
      Last edited by gits; Jul 24 '08, 11:19 AM. Reason: remember to use CODE tags !!!!

      Comment

      • maminx
        New Member
        • Jul 2008
        • 77

        #4
        and of course, what is the error that show in the browser??

        Comment

        • tjc0ol
          New Member
          • Nov 2007
          • 26

          #5
          Originally posted by Gulzor
          try to initialize js var "oh" first :

          [CODE=javascript]var oh = document.getEle mentById("oh");[/CODE]

          then

          [CODE=javascript]oh.style.visibi lity = "hidden"; // or "visible"[/CODE]
          Thanks a lot, I tried this one and it work. -tj

          Comment

          • tjc0ol
            New Member
            • Nov 2007
            • 26

            #6
            Originally posted by maminx
            and of course, what is the error that show in the browser??
            In Firefox when you clicked on the others in <select> there's no pop-up will show.

            By the way I tried your code above and it won't work. Anyways thanks for the infos. -tj

            Comment

            Working...