Brenda Ivett
Brenda Ivett

Reputation: 19

IE9 dropdown list issue

I have an issue with a dynamic dropdownlist in IE9.

I have a table, and one of the columns gets filled out with combos, one combo per row, and each of those combos is created with a HTML 5.0 code, like this:

<select id="cboABC0" class="RetrieveList cboABC" data-index="0" data-info="3" name="cboABC">
<option selected="selected" value="N">Select</option>
<option value="P">Partial</option>
<option value="C">Complete</option>
<option value="CA">Cancelled</option>
</select>
</td>

I want something to happen when one of the options is selected in the dropdown list, depending on the selected option, and for that, I have tried different ways of using the events of the class RetrieveList, with JQuery:

$(".RetrieveList").live(''click'',function(event){      

var val_info = $(this).attr("data-info"); 
var val_index = $(this).attr("data-index");

var sOptionSelected = $(this).val();

alert(sOptionSelected);

// Here is where I want to do something , depending on the selected option.

}); 

With the "live click", at least the clicking event gets "fired", but it doesn't recognize what I choose, it stays with the last option I had chosen, for example if nothing has been selected and I open the combo, move to another option and click that option, it goes to the click event, but the value that returns with $(this).val() is the previous not the one just selected. In the other hand, if I select the option with the arrow keys and then give click, id does recognize the new value. It's like if it only recognizes the change of "click" but not of value.

I have tried with "bind click", "live change" and "bind change" and with those options, the click doesn't even get "fired".

Again, this all happens with IE9, with Mozilla, I haven't had any major problems.

If anybody could please help me with this issue, I will greatly appreciate it.

Thanks in advance,

Regards!

Brenda

Upvotes: 0

Views: 703

Answers (2)

chrisvillanueva
chrisvillanueva

Reputation: 1359

try:

    $(".RetrieveList").live('change',function(event){      

var val_info = $(this).attr("data-info"); 
var val_index = $(this).attr("data-index");

var sOptionSelected = $(this).val();

alert(sOptionSelected);

// Here is where I want to do something , depending on the selected option.

}); 

Upvotes: 0

sachleen
sachleen

Reputation: 31131

First off, you have ''click'' when it should be just 'click'. I wouldn't use click anyway, instead use change so it fires whenever the list changes and not just when the user clicks it. click will fire even if you just click it without making a different selection (the click to view all the dropdown items)

Fixing that, it works in all browsers for me.

DEMO

Upvotes: 2

Related Questions