Advanced Search

Simple Javascript Show/Hide for Form Elements

/ Published in: JavaScript
Save to your folder(s)
This simple script toggles element visiblity on a page based on a form field's current value.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  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


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.