Switch Content Script - Problems with option boxes

[MydKnight]

1) Script Title: Switch Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tchcontent.htm

3) Describe problem: I have the switch content script running a group of selection boxes such that when you select one of the options, it displays relevant instructions. Unfortunately, I did all my work in FF and forgot to test in IE (I know...bad coder) and didn't know that the whole thing went wonky in IE. I pared it down to just a single option/select with an associated div and it failed to show the div contents when selected. When i switched select to ul and option to li it works fine in IE. Is there something that needs to be changed for this script to act on option/select data in IE or will it just not work at all?

To get an idea what im working with, go to:
http://techtrain65.motolms.com/lnf/m...rbondpair.html

Any help appreciated.

Shiloh Madsen

[ddadmin]

The problem is that your headers are actual OPTION tags, for example:

<option style="color: black;" id="apple-title">Apple</option>

IE doesn't react to the onclick event handler inside this tag, which is what the script uses to trigger the expand/collapsing of the contents. I'll see if there's a workaround without having to change your HTML. Update soon.

[ddadmin]

Ok, try replacing the below line inside the .js file:

			this.headers[i].onclick=function(){instanceOf.toggledisplay(this)}

with this instead:

		if (this.headers[i].tagName=="OPTION"){
			this.headers[i].parentNode.onchange=function(){
				var targetoption=this.options[this.selectedIndex]
				instanceOf.toggledisplay(targetoption)
			}
		}
		else
			this.headers[i].onclick=function(){instanceOf.toggledisplay(this)}

What it does is if the header is an OPTION tag, go to the parent SELECT tag to add the triggering event handler.

[MydKnight]

Still no love after applying the change. It seems like its GETTING there, but still majorly buggy. Firstly, some of the dropdowns are appearing even though they should be hidden, and are further down the page...which looks more than a little odd. Secondly, the drop down functionality seems to apply only if you pick something other than the first item in the list. I could get around this by changing the first item to simply say Select, but not sure if theres a more elegant solution. Thanks for the quick help..its appreciated. To see what I am currently observing, go to http://www.hinsdaleunitarian.org/kcs...rbondpair.html.

Still working fine in FF, just IE being difficult.

[ddadmin]

Firstly, some of the dropdowns are appearing even though they should be hidden, and are further down the page

Can you give an example (list the menu selections).

Secondly, the drop down functionality seems to apply only if you pick something other than the first item in the list.

Changing the first item to "Select" probably is the easiest way. The issue has to do with how the "onchange" event handler behaves. Normally with a select menu you also add a form button to indicate the desired option, so it's not a problem. However, since you don't have these controls, and IE doesn't support the "onclick" event hander inside select menus, you have this problem.

[MydKnight]

Thanks, I will implement the Select an Item select box to fix the first issue. As to the second, the ones I am seeing are A630, NHSTH4C2ALC, Jawbone, and ARIS-21.

I am also including a screenshot in the hopes that it will help. URL remains the same as my previous post.

[MydKnight]

Just wanna give a little nudge to see if anyone has an idea why the script is misbehaving for me in IE?

[MydKnight]

I am still unable to get the "artifacts" to go away in IE...can anyone lend any insight into why this is happening?

[ddadmin]

Sorry for the delay in replying, this is a rather confusing question/ issue. Looking at your page now, I don't see the two suggestions I made earlier implemented yet:

1) http://www.dynamicdrive.com/forums/s...02&postcount=3

2)

Changing the first item to "Select" probably is the easiest way. The issue has to do with how the "onchange" event handler behaves. Normally with a select menu you also add a form button to indicate the desired option, so it's not a problem. However, since you don't have these controls, and IE doesn't support the "onclick" event hander inside select menus, you have this problem.

Can you do that first? Right now testing your page in IE, none of the selections reveal additional contents actually, let alone trying to get to A630, NHSTH4C2ALC, Jawbone, or ARIS-21 first.

[MydKnight]

Sorry...I forgot to upload the new file. The select changes have been made...still seeing the problem.