0

Right. Im a php developer and I have never taken the time to study Javascript, and it always gives me a hard time.

I have a drop down menu with 2 options. The default option is just Choose Payment. If I go to credit card, then nothing is supposed to happen, but if I go to other, a textbox should appear where I can write additional information. The code I have now works fine, the only problem is, that when the page loads, the text box appears on default, how can I have it hidden by default, and only shown when it is set to other. Thanks.
Here is the code.

<HEAD>
   <script type="text/javascript">  
     
   function toggleElement(sel1, element1) {  
     
     element1 = document.frm1.elements[element1];  
     //alert(element1.value);  
     if (sel1.value == 'others') {  
     
       element1.style.display = 'inline';  
   
    }  
     else {  
     element1.value = ''; // input text will be empty  
       element1.style.display = 'none'; // hide text element  
     }  
     
     return;  
  }  
 </script>  
</HEAD>


<BODY>
   <form name="frm1" >  
     
   <select name="city" id="city" onchange="toggleElement(this, 'txt1')">  
    <option value="patna">Choose Payment</option>  
    <option value="mumbai">Credit Card</option>  
    <option value="others">Others</option>  
   </select>  
   <input type="text" name="txt1" id="txt1" value="" /> any text  
      
   </form>  

</body>
2
Contributors
3
Replies
4
Views
6 Years
Discussion Span
Last Post by hielo
1
<HEAD>
   <script type="text/javascript">  
     
   function toggleElement(sel1, element1) {  
     
     element1 = document.frm1.elements[element1];  
     //alert(element1.value);  
     if (sel1.value == 'others') {  
     
       element1.style.display = 'inline';  
   
    }  
     else {  
     element1.value = ''; // input text will be empty  
       element1.style.display = 'none'; // hide text element  
     }  
     
     return;  
  }  
  
  window.onload=function(){
      toggleElement(document.getElementById('city'), 'txt1')
  }
 </script>  
</HEAD>


<BODY>
   <form name="frm1" >  
     
   <select name="city" id="city" onchange="toggleElement(this, 'txt1')">  
    <option value="patna">Choose Payment</option>  
    <option value="mumbai">Credit Card</option>  
    <option value="others" selected="selected">Others</option>  
   </select>  
   <input type="text" name="txt1" id="txt1" value="" /> any text  
      
   </form>  

</body>
Votes + Comments
Very helpful comment he made to me about Javascript
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.