CODEWITHSUNDEEP
jqueryhtmljquery-selectors
ssahu
ssahu

Reputation: 888

jquery selector to get all select dropdowns with a particular value selected

How do I select all the select boxes using a jQuery selector where value selected is "A1"?

Sample select box:

<select name="accesslevel">
<option value="A1">A1 Access</option>
<option value="A2">A2 Access</option>
</select>

I have to use the selector to do the following thing:

.parent().nextAll('td[id^="A1Access"]').show();
.parent().nextAll('td[id^="A2Access"]').hide();

Can anyone help?

Upvotes: 25

Views: 23533

Answers (6)

codersaif
codersaif

Reputation: 1

Make an id like this..

<select name="accesslevel" id="myselector">
<option value="A1">A1 Access</option>
<option value="A2">A2 Access</option>
</select>

Now select it with that id.

$("select#myselector option:selected").each(function () 
{
     alert($(this).text() + " ");
});

Upvotes: 0

dsnettleton
dsnettleton

Reputation: 969

As mentioned before, Prakash's solution is the closest, but it selects the option value rather than the select box itself. This can be fixed with the :has selector.

$('select:has(option[value="A1"]:selected)')

Upvotes: 53

Sandwich
Sandwich

Reputation: 2289

Here's something like your original spec, but just modified a bit to work with my selectors.

$('.container').find('option[value=A1]').filter(':selected').parent('select').show();

And here it is Simplified:

$('option[value=A1]:selected').parent('select');

Upvotes: 2

Mujah Maskey
Mujah Maskey

Reputation: 8804

$('select').filter(
function(){   
   if($(this).val()=="A1")
        return true;
    else
        return false;
}
)

you can add your function after this like

$('select').filter(
function(){   
   if($(this).val()=="A1")
        return true;
    else
        return false;
}
).parent().nextAll('td[id^="A1Access"]').show();

Upvotes: 3

Prakash
Prakash

Reputation: 6602

Try :

$('select option[value="A1"]:selected')

Upvotes: 24

S L
S L

Reputation: 14318

For simply selecting option in all html body

alert($('option[value=A1]').html());

For select

alert($('select[name=accesslevel]').find('option[value=A1]').html());

But alert will work with only one element.

For select you have

$('option[value=A1]').parent().remove();

It will select the parent and remove it.

Upvotes: 0

Related Questions