Hi all,
I am trying to load a FisheyeList into a content pane on the click of a href. I have around 4 hrefs in the page and each href points to a html page with a different FisheyeList. When I click on any href for the first time it works fine, however, when I click on a href for the second time or when I click on a different href and move the mouse over the FisheyeList I get a error in Firefox saying "this.children[p].domNode has no properties".
It seems like the FisheyeList that is once loaded is never removed 'internally' inspite of explicitly trying to remove it. I have tried everything that I could to solve this but its not working out, not sure if this could be a bug in how the FishEyeList works, can someone please help me with this?
Page in which I have a content pane and trying to load different fisheyelists on the click of respective hrefs:
"http://www.w3.org/TR/html4/loose.dtd">
<html debug="true">
<title>FishEye Test</title>
<head>
<script language="javascript" type="text/javascript"
src="firebug/firebug.js"></script>
<style type="text/css">
@import "dojoroot/dojo/resources/dojo.css";
@import "dojoroot/dijit/themes/soria/soria.css";
@import "dojoroot/dojox/layout/resources/RadioGroup.css";
@import "dojoroot/dojox/widget/FisheyeList/FisheyeList.css";
<!-- used in news -->
@import "dojoroot/dijit/themes/dijit.css";
<!-- used in news -->
.dojoxFisheyeListBar {
margin: 0 auto;
text-align: center;
}
.outerbar {
background-color: #f2f8fd;
text-align: center;
position: absolute;
left: 0px;
top: 0px;
width: 100%;
border-bottom:1px solid #333;
}
</style>
<script type="text/javascript" src="dojoroot/dojo/dojo.js"
djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
// Load Dojo's code relating to the Button widget
dojo.require("dojo.parser");
dojo.require("dijit.layout.LayoutContainer");
dojo.require("dijit.layout.TabContainer");
dojo.require("dojox.layout.ContentPane");
dojo.require("dojox.widget.FisheyeList");
<!--used in news-->
function content(msg){
var radoiGroupFade1=dijit.byId('MainContent');
alert(radoiGroupFade1);
if(msg==1)
page="java";
else if (msg==2)
page="erp";
else if (msg==3)
page="service";
else if (msg==4)
page="more";
dojo.xhrPost({
url: 'content/'+page+'.html',
load: function (data,ioArgs) {
var radoiGroupFade=dijit.byId('MainContent');
alert(radoiGroupFade);
radoiGroupFade.setContent(data);},
error: function (error){
alert("Error while processing Data.<br>"+ error);}
});
}
</script>
<body class="soria">
<div dojoType="dojox.layout.ContentPane" id="MainContent"
layoutAlign="client" style="overflow:auto;width=300px;height=580"
href="ContentTab.html" preventCache="true" title="MainContent" executeScripts="true">
</div>
<div dojoType="dojox.layout.ContentPane" id="links">
<a href='javascript:content(1);' >Java</a>
<a href='javascript:content(4);'>More</a>
<a href='javascript:content(2);' >ERP</a>
<a href='javascript:content(3);'>Service</a>
</div>
</body>
Page in which the fisheyelist is present(All pages have a similar fisheyelist with images and div ids being different):
itemWidth="40" itemHeight="40"
itemMaxWidth="150" itemMaxHeight="150"
orientation="horizontal"
effectUnits="2"
itemPadding="10"
attachEdge="center"
labelEdge="bottom"
id="fisheyeJava"
>
<div dojoType="dojox.widget.FisheyeListItem"
id="item1"
onclick="alert('click on ' + this.label + '(from widget id ' + this.widgetId + ')!');"
label="Item1"
iconSrc="images/home1.gif">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="Item2"
label="Item 2"
iconSrc="images/products.gif">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="Item3"
label="Item 3"
iconSrc="images/training.gif">
</div>
<div dojoType="dojox.widget.FisheyeListItem"
id="Item4"
iconSrc="images/careers2.gif">
</div>
</div>
Thanks,
Vinay.