Reputation: 919
I have a form, on the first page of the form the user can select how many people to register, in the next step the form asks the same questions for each registrant. I would like for one of the questions to only display for the first registrant and be hidden for the other registrants.
Each of the div's use practically the same naming but the number after rptAttributesPerRegistrant changes, I want to show
#PC4187_ev2wiz_step2_ctlRegs_rptPerEvent_ctlAttributes_0_rptRegistrants_0_rptAttributesPerRegistrant_0_lblAttributeName_0
but hide any others, for example, hide the following:
#PC4187_ev2wiz_step2_ctlRegs_rptPerEvent_ctlAttributes_0_rptRegistrants_0_rptAttributesPerRegistrant_1_lblAttributeName_0
#PC4187_ev2wiz_step2_ctlRegs_rptPerEvent_ctlAttributes_0_rptRegistrants_0_rptAttributesPerRegistrant_2_lblAttributeName_0
and so on . . .
Please see for the entire code http://jsfiddle.net/jelane20/U6kja/
I do not want to hide the vegetarian field however which also uses the same type of div
I am not sure how to target every instance of the div but the first one and exclude the vegetarian question, I need to hide any of the divs that use a number greater than 0. Any help would be greatly appreciated!
Thank you!
Upvotes: 1
Views: 92
Reputation: 2068
Please see the below fiddle fiddle
Whenever you have long value for attributes and want to match a particular part you have use jquery attribute selectors
$("[id*='rptAttributesPerRegistrant']")
The above statement will give you all the selectors containing "rptAttributesPerRegistrant" then you can filter out based on type etc.
Upvotes: 1
Reputation: 1028
It's not entirely clear to me what you're trying to accomplish, but this shows only the first registrant options:
$('div.Ev2_AttributeContent').children().not(':first-child').hide();
To show the options for the second registrant:
$('div.Ev2_AttributeContent').children().not(':nth-child(3)').hide();
... and for the third:
$('div.Ev2_AttributeContent').children().not(':nth-child(5)').hide();
Upvotes: 0