Sunday, December 14, 2008

Yahoo User Interface (YUI ) not working in Internet Explorer 6 , javascript error

I was working on Yahoo User Interface stuff and it wasn't working in internet explorer 6 and possibly seven. So the symptons were the page loaded fine, and there were no errors but my dialog panel wouldn't pop up. So upon closer examination, you could see that there was a javascript error, however as the page continued to load the warning sign went away. So I installed the microsoft script debugger for ie, and turned debugging on(both checkboxes). And it pointed me to a line similar to this that firefox was dealing with just fine:

YAHOO.company.container.panel1 = new YAHOO.widget.Panel("dialog-panel1", { width:"320px", visible:false, constraintoviewport:true, context:["link1","tl","bl", ["beforeShow", "windowResize"]], } );

However, when the script was cleaned up, and indented correctly it ran just fine.

{ context:["link2","tl","bl", ["beforeShow", "windowResize"]],
width:"320px",
visible:false,
constraintoviewport:true } );

**I couldn't put the whole solution because my blog template, screws with the spacing just ident the code so it all lines up as above and leave the YAHOO.company.container.panel1 = new YAHOO.widget.Panel("dialog-panel1",**

In my defense I didn't write the original script. The dialog pops up now it's just not displaying right, which is something wrong with our custom css, becuase the normal yahoo stuff looks like it would work just fine if rendered instead of ours. The day before I spent a significant amount of time troubleshooting an IE 6 problem where IE 6 had arbitrarily assigned values to either the padding or the margin I can't remember now, my fault for not documenting. The solution was to explicitly set the values in the style tag.

No comments: