Jessica
Jessica

Reputation: 3769

Making some elements on a form invisible with jQuery

I have a form with an id of "dialogForm" containing input, textareas and selects.

I would like to make all of the above elements (except the one with id="Text") not visible so that the user cannot see or enter any new data in them.

<textarea class="mceEditor wijmo-wijtextbox ui-widget 
                         ui-state-default ui-corner-all" name="Text" 
id="Text" style="width: 825px;" rows="10" cols="99">test</textarea>

I'd then like to style the above element so it completely fills the form. Can someone give me some pointers as to how I can do this.

Upvotes: 0

Views: 151

Answers (2)

Goran Mottram
Goran Mottram

Reputation: 6304

To hide just specific form elements, you'll want something like the following:

$('#dialogForm').find('input[type="text"], select, textarea:not(#text)').hide();

This will ensure that your <textarea id="text" /> element along with other elements (divs and such) aren't hidden either. If you need to add other elements like checkboxes and such, just append them to the selector list.

Check this jsFiddle.

Upvotes: 1

Chamika Sandamal
Chamika Sandamal

Reputation: 24302

$("#dialogForm").children().not("#id").css("display":"none");

Upvotes: 1

Related Questions