O'Reilly logo

jQuery and JavaScript Phrasebook by Brad Dayley

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Showing/Hiding Form Elements

$("#tires,#model").hide(); $("#make").on("change", function(){   if($(this).val() == ""){     $("#tires,#model").hide(); }   else{ $("#model").show(); } });

Another great trick when providing flow control for a web form is to dynamically hide and show elements. Less is more; you shouldn’t necessarily show users more elements than they need to fill out.

For example, if the form has elements for both men’s sizes and women’s sizes, don’t show both. Wait for users to select the gender and then display the appropriate size elements.

Form elements can be shown and hidden in jQuery using the .show() and .hide() methods. Alternatively, if you want to make the element invisible but still ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required