PDA

View Full Version : Switch Content Script - Problems with option boxes



MydKnight
05-27-2008, 03:13 PM
1) Script Title: Switch Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/switchcontent.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/md/CC/COE/masterbondpair.html

Any help appreciated.

Shiloh Madsen

ddadmin
05-27-2008, 09:44 PM
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
05-27-2008, 09:54 PM
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
06-06-2008, 04:28 PM
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/kcstuff/masterbondpair.html.

Still working fine in FF, just IE being difficult.

ddadmin
06-08-2008, 08:53 PM
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
06-13-2008, 05:00 PM
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
06-20-2008, 12:32 PM
Just wanna give a little nudge to see if anyone has an idea why the script is misbehaving for me in IE?

MydKnight
06-25-2008, 02:29 PM
I am still unable to get the "artifacts" to go away in IE...can anyone lend any insight into why this is happening?

ddadmin
06-26-2008, 08:12 AM
Sorry for the delay in replying, this is a rather confusing question/ issue. Looking at your page (http://www.hinsdaleunitarian.org/kcstuff/masterbondpair.html) now, I don't see the two suggestions I made earlier implemented yet:

1) http://www.dynamicdrive.com/forums/showpost.php?p=145302&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
06-26-2008, 03:45 PM
Sorry...I forgot to upload the new file. The select changes have been made...still seeing the problem.

ddadmin
06-27-2008, 06:30 PM
Testing your page using IE7 and making the selections you captured in your screenshot, I don't get the problem you're describing:

http://i30.tinypic.com/a9lj4l.gif

Is the issue only occuring in IE6 for you, or IE7 as well?