Posted By

beneberle on 03/04/11


Tagged

javascript html ui


Versions (?)

Simple Javascript Show/Hide for Form Elements


 / Published in: JavaScript
 

This simple script toggles element visiblity on a page based on a form field's current value.

  1. <script type="text/javascript">
  2. <!--
  3. function showhide(what,obj) {
  4. // alert(what);
  5. if(what != "1") {
  6.  
  7. obj1 = document.getElementById(obj);
  8. obj1.style.display = '';
  9. } else {
  10.      obj1 = document.getElementById(obj);
  11.    obj1.style.display = 'none';
  12. }
  13. }
  14. function hide(obj) {
  15. // alert(obj);
  16. obj1 = document.getElementById(obj);
  17. obj1.style.display = 'none';
  18. }
  19. //-->
  20. </script>
  21.  
  22. <!-- HTML form element that triggers toggle -->
  23.  
  24. <input class="inputbox" type="radio" name="option" value="1" onchange="showhide(this.value,'toggle')" />Option 1<br/>
  25.  
  26. <!-- HTML element that toggles -->
  27.  
  28. <div id="toggle">This content will only be shown if option one is chosen</div>

Report this snippet  

You need to login to post a comment.