this.value not being recieved in ie8

[freelance84]

The html source:

<select id="a" name="area" class="select1" onchange="getSub1(this.value)" >
      <option selected="selected"></option>
      <option>Art</option>
</select>

 

The JS

/*getting the sub cat1 are area and returning accordingly*/
function getSub1(str){
alert(str)
/*Check if a an area is selected*/
if (str==""){
	wipeAll();
	return;
}
/*xml connection*/
xmlsetup().....
}

 

The above function works in most browsers... except ie8.

 

In ie8 the alert displays nothing when an item is selected...

 

I know i can get it working if i just send 'this' from the function in the html then get the value from withing the js... but does anyone know a reason why this.value isn't sending the value in ie though?

[Adam]

You're not actually defining the value of each option, just the text. When the data is posted (the form submitted), browsers default to using the text instead of the value. Browsers also do this when retrieving the value with JavaScript, except for it appears IE.

[freelance84]

I know this reply is a little late, but better late than never. This solution, was cross browser and also meant i did not need to double the info in both the value of the option as well as the text:

 

The select menu:

<select id="a" name="area" onchange="getSub1(this)" >
      <option selected="selected"></option>
      <option>random value</option>
</select>

The js to grab the selected option on change:

/*getting the sub1*/
function getSub1(thisSelect){
str =thisSelect.options[thisSelect.selectedIndex].value;
alert('str');
}

 

(also appologies for not replying sooner adam (think i went on holiday to be honest  )