Return to Snippet

Revision: 30316
at August 11, 2010 19:26 by Rembrand


Initial Code
$(document).ready(function() {
	$('#form-btw').hide(); //hide field on start
	
	$('#Klant').change(function() {
 
	 var $index = $('#Klant').index(this);
	 
	 if($('#Klant').val() != 'professional') { //if this value is NOT selected
	 $('#form-btw').hide(); //this field is hidden
	 } 
	 else {
	 $('#form-btw').show();//else it is shown
	 
	 }
        });
 });

---

<select name="Klant" id="Klant">
  <option id="field-particulier" value="particulier">Particulier</option>
  <option id="field-professional" value="professional">Professional</option>
</select>

<input name="BTW" type="text" class="form-text" id="BTW" />

Initial URL
http://www.josephijs.be/bestellen.html

Initial Description
Show a form field if 1 value from a dropdown is chosen, hide is the other is chosen. Can be extended to include more fields and values. Could get messy if you start nesting more than 2 'if else' but it gets the job done.

Initial Title
Show/hide form fields based on a selection from a dropdown menu

Initial Tags
forms

Initial Language
jQuery