IOU Hide Conditional Fields For Free

The Javascript uses jQuery to change the DOM depending on the selections made. Essentially, depending on the conditions of a field answer, you can bulk turn show/hide other components of the form. For validation purposes, some extra attributes are changed depending on the selection.

You have to implement two methods for hiding. display: none works for FF, but not Chrome or IE. So the second method is wrapping the <option> in a <span> with display: none . FF won't do it (technically invalid HTML, per the spec) but Chrome and IE will and it will hide the option.

JS$("#seeAnotherField"). change(function() {if ($(this). val() == "yes") {$('#otherFieldDiv'). show();$('#otherField'). attr('required', '');$('#otherField'). attr('data-error', 'This field is required.');} else {$('#otherFieldDiv'). hide();$('#otherField'). removeAttr('required');More items...

If you dont want to show states first then hide them 'display:none' Vitorino fernandes. Oct 8 '14 at .<div id="states" style="display:none"> u_mulder. Oct 8 '14 at .you can also use jquery add this before on click event $("#states").hide(); Vitorino fernandes. Oct 8 '14 at .Oct 8, 2014

You can switch it off by going to Edit - Prefs. - Forms, and tick off "Showborder hover color for fields".

To quickly hide a field, you can do it by clicking the field, then right-clicking, and click the Hide option from the quick options: You can also do it through the properties section of a field.

6 Answers$('this') should be $(this) : there is no need for the quotes inside the paranthesis.use .val() instead of .value() when you want to retrieve the value of an option.when u initialize "selection" do it with a var in front of it, unless you already have done it at the beggining of the function.Sep 9, 2016