How to disable classes with same name and differnt instance in jquery?

Question

I am having a webControl with 3 TextBoxes and I am using this webControl in same page but twice with 2 instances.

I want to hide one text box from one control and other text box from the other control .

<uc1:VoyageSelector runat="server" ID="VoyageSelector1"  Instance="1" />

<uc1:VoyageSelector runat="server" ID="VoyageSelector2"  Instance="2" />

This control is having text box classes as:

$(".vss-week-picker").val(); 
$('.vs-voyage-picker').val(); 
$('.vs-vessel-display').val();

When I disable:

$(".vss-week-picker").hide();

Both Controls Week TextBox is getting hidden. How can I solve this problem of hiding one instance class?

AntouanK · Accepted Answer · 2013-07-03T12:10:04.923

0

Get the id of the element that the control produces, and use it to select your targets.

For example, if it produces a parent element with id 'VoyageSelector1', then you hide its textboxes like this :

$('.vss-week-picker','#ContentPlaceHolder1_VoyageSelector2_tblVoyageSelector').‌hide();

edited Jul 03 '13 at 12:10

answered Jul 03 '13 at 11:34

AntouanK

I just gave an example of how to do it, of course it won't work if you copy paste. can you post the html that's produced? – AntouanK Jul 03 '13 at 11:38
$("#ContentPlaceHolder1_VoyageSelector2_tblVoyageSelector .vs-service-picker").hide(); this way its wokring – þÍńķ Jul 03 '13 at 12:04
that's what I said. get the generated id and use it. I didn't know the exact id, `VoyageSelector1` was an example. Just replace `VoyageSelector1` with `ContentPlaceHolder1_VoyageSelector2_tblVoyageSelector` in my code, it's the same. You wil get this: `$('.vss-week-picker','#ContentPlaceHolder1_VoyageSelector2_tblVoyageSelector').hide();` – AntouanK Jul 03 '13 at 12:07
Ok. I'm glad it works. And to be precise, this way is (maybe only theoriticaly) faster. See here --> http://stackoverflow.com/questions/650860/jquery-adding-context-to-a-selector-is-much-faster-than-refining-your-selector – AntouanK Jul 03 '13 at 12:10

score 0 · Answer 2 · answered Jul 03 '13 at 11:36

0

i did this in past, don't remember exactly, may this works

$("[id ^= VoyageSelector1] .vss-week-picker").hide();

answered Jul 03 '13 at 11:36

A.T.

$("#ContentPlaceHolder1_VoyageSelector2_tblVoyageSelector .vs-service-picker").hide(); this way its wokring ..., Thnks :) – þÍńķ Jul 03 '13 at 12:05

2 Answers2