PDA

View Full Version : [solved] Layout (viewPort) works great in Firefox, dies in Explorer



graveyardfashions
23 Jan 2008, 12:25 PM
I created a layout with north, south, west, and center areas. The west region is a treeview, and the other three aren't ext components.

In Firefox, everything is lovely and I have no Firebug errors.

In IE, the layout is REALLY tall, missing the west region, and generally looks broken. I'm also getting a javascript error: 'events is null or not an object' on a mysteriously empty line.

The tree worked fine in IE prior to adding it to a layout, so I'm pretty sure it's the viewport.

Thank you in advance for any help you can give!

Best wishes,
Cat



<script type="text/javascript">
Ext.onReady(function(){

//Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
var index_tree = new Ext.tree.TreePanel({
width:100,
//autoHeight:true,
rootVisible:false,
autoScroll:true,
containerScroll: true,
title: 'Select an ISA',
loader: new Ext.tree.TreeLoader({ dataUrl:'includes/treedata.cfm' }),
root: new Ext.tree.AsyncTreeNode({
text:'title'
})
});

var viewport = new Ext.Viewport({
layout:'border',
items:[
new Ext.BoxComponent({
region:'north',
el: 'header',
style: 'background: white;',
height:48
}),
new Ext.BoxComponent({
region:'south',
el: 'footer',
height:30
}), {
region:'west',
el: 'west',
collapsible: true,
width: 225,
minSize: 175,
maxSize: 900,
autoScroll:true,
containerScroll: true,
layout:'fit',
margins:'0 1 0 0',
items: [index_tree]
},
new Ext.BoxComponent({
region:'center',
el: 'content',
margins:'0'
}),
]
});
});
</script>
and my page:


<div id="header" style="z-index:10">
<div style="position: absolute; top: 3px; left: 3px;">
Yadda Yadda
</div>
</div>

<div style="padding-top:37px;padding-bottom:0px">

<div id="west" style="overflow: auto;">
</div>

<div id="content" style="z-index:1">
<h1>Welcome!</h1>
Some sort of welcome content should go here, with possibly instructions on what to do.
</div>

</div>

<div id="footer" style="z-index:10">

<div class="copyright">Copyright (c) 2008</div>
<div class="utilityLinks"><a href="disclaimer.cfm" title="Disclaimer">Disclaimer</a></div>

</div>

devnull
23 Jan 2008, 12:40 PM
extra comma after your boxComponent

graveyardfashions
23 Jan 2008, 12:40 PM
Ha! Oh errant comma, why hast thou forsaken me?

Have I been untrue? Have I been cruel, so that you felt the need to hide at the end of a list? Surely not!

Mine love for you is everlasting, and I have returned you to thy proper place.

devnull
23 Jan 2008, 1:47 PM
I suggest some kind of context aware editor or IDE such as aptana that will make simple mistakes like this painfully obvious ;)

Allan
22 Feb 2008, 6:17 AM
I suggest some kind of context aware editor or IDE such as aptana that will make simple mistakes like this painfully obvious ;)

Actually, they don't make them painfully obvious at all! Neither Aptana nor Netbeans catch all commas that are out of place.

Does anyone know of a JS editor that does catch all JS syntax errors?

Allan

Carina
22 Feb 2008, 6:34 AM
Does anyone know of a JS editor that does catch all JS syntax errors?

I also did some research about that a couple of days ago. You can configure the Intellij Idea inspection profiles for JavaScript pretty well and it catches a lot of stuff (e.g. trailing commas in objects) but I haven't found a way to highlight trailing commas in an array. I'm thinking about writing an Idea plugin myself just to add this functionality because I find it highly annoying (or frustrating). The only thing that works for me is jslint but it would be far more convenient if there was IDE support for this.

It might have something to do with the fact that all real browsers ;) already ignore the trailing comma. Only "JScript currently gets this implementation detail wrong, even though it was specified in ECMAScript 3" - http://ejohn.org/blog/bug-fixes-in-javascript-2/

Or they just don't care, I really don't know..

para
22 Feb 2008, 7:03 AM
I don't know of one. I do all my development in FF. Once I'm satisfied with it in FF, I run it through JSLint (http://www.jslint.com/). Once all errors and warning are taken care of, it works in IE every time.