webdad3
webdad3

Reputation: 9080

jquery :selected not working as expected

I have the following snippet of a HTML select box:

<select id="Obj_cboscreen" class="menubarselect" name="page">
<option att="1stOption" value="0" selected="">abc</option>
<option att="2ndOption" value="1">def</option>

When I run the following pieces of code:

var attribute = $('#Obj_cboscreen :selected').attr('att');
var name = $('#Obj_cboscreen :selected').html();

I get 1stOption and abc (respectively).

When I change the select box to a different option, for example:

<select id="Obj_cboscreen" class="menubarselect" name="page">
<option att="1stOption" value="0">abc</option>
<option att="2ndOption" value="1" selected="">def</option>

I get the same results of the output before.

"1stOption and abc"

Now I noticed the selected="". That doesn't look right, I've looked around in the project and I'm unable to find where that is being produced, but it is rendering properly.

I'm wondering why the selected selector isn't working properly?

Upvotes: 0

Views: 6081

Answers (4)

Alice Kuek
Alice Kuek

Reputation: 1

var attribute = $('#Obj_cboscreen option[selected=true]').attr("att");
alert(attribute);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<select id="Obj_cboscreen" class="menubarselect" name="page">
<option att="1stOption" value="0">abc</option>
<option att="2ndOption" value="1" selected="true">def</option>

Upvotes: 0

Pir Abdul
Pir Abdul

Reputation: 2334

There is a problem with att, i think this should be enclosed in quotes, Like

var attribute = $('#Obj_cboscreen option:selected').attr("att");

True is missing in selected, always format your html, because some times its behave uncommonly

<select id="Obj_cboscreen" class="menubarselect" name="page">
<option att="1stOption" value="0">abc</option>
 <option att="2ndOption" value="1" selected="true">def</option>

Upvotes: 4

ipr101
ipr101

Reputation: 24236

The following code works for me -

var attribute = $('#Obj_cboscreen :selected').attr("att");
var name = $('#Obj_cboscreen :selected').html();

alert(attribute + name);

There are a couple of changes from your code.

attr(att) to attr("att")

$('#Obj_cboscreen:selected') to $('#Obj_cboscreen :selected')

The following jsfiddle shows the code working when the 'selected' attribute is added to the second option.

http://jsfiddle.net/ipr101/bjWt3/

Upvotes: 4

Dave L.
Dave L.

Reputation: 9791

Here take a look at this -- maybe it will help you out:

http://jsfiddle.net/dKyrM/

Upvotes: 2

Related Questions