PDA

View Full Version : [SOLVED] Very strange IE7 problem / Ext.Window



thedave
16 Aug 2008, 3:02 PM
Hi Forum!

I have a very strange problem with my IE7. Maybe I am just blind. I try to render a plain and simple Ext.Window. I get and error like "Line: 237, Character: 9, Code: 0, Error Message: The object does not support this kind of property."

I use the IE 7.0 and ext2.2. FF3 works fine. I tried using the DebugBar and companionJS to narrow the error. No help.

So I set up a test page which looks like this:



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>

<title>test</title>

<link rel="stylesheet" type="text/css" media="screen" href="ext-all.css" />
<script type="text/javascript" src="js/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="js/ext-all-debug.js"></script>

<script type="text/javascript">


Ext.onReady(function(){

var win;
var mediagen_button = Ext.select('.mediabutton');


var clicked = function(e, a){
alert("clicked");
// create the window on the first click and reuse on subsequent clicks
if (!win) {
win = new Ext.Window({
el: 'mediadiv',
title: 'sometitle'
});
}


win.show();


};

if (mediagen_button) {
mediagen_button.on('click', clicked);
}
});
</script>

</head>

<body>
test

<div id="mediadiv"></div>

<form>
<input type="button" name="button" value="button" id="button" class="mediabutton">
</form>

</body>
</html>


Can anyone reproduce this error?

Thanks for your help.
Dave

thedave
17 Aug 2008, 4:03 AM
Hi again.

I think I found the error. When I change this line:


<script type="text/javascript">

to


<script language="javascript">

it works. Didn't know that this kind of error can be produced by using a wrong property of a tag. But after all.. its the Internet Explorer. ;)

Cheers,
Dave

thedave
17 Aug 2008, 5:16 AM
Hi again.

In my excitement I jumped the gun a bit. I haven't found the solution after all.

But I can very easily reproduce the error now. I downloaded a fresh extJS2.2. I added the word "test" after the body tag. When I run the example now, my IE throws the same error.

What may this be? Corrupt IE7?

Any ideas? Can anyone reproduce this error?

My example now looks like this, taken from examples\window\hello.html. I haven't touched the hello.js:



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Hello World Window Example</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />

<!-- GC -->
<!-- LIBS -->
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<!-- ENDLIBS -->

<script type="text/javascript" src="../../ext-all-debug.js"></script>

<script language="javascript" src="hello.js"></script>

<!-- Common Styles for the examples -->
<link rel="stylesheet" type="text/css" href="../shared/examples.css" />

<style type="text/css">
.x-panel-body p {
margin:10px;
font-size:12px;
}
</style>
</head>
<body>test
<script type="text/javascript" src="../shared/examples.js"></script><!-- EXAMPLES -->

<h1>Hello World Window</h1>
<p>This example shows how to create a very simple modal Window with "autoTabs" from existing markup.</p>
<input type="button" id="show-btn" value="Hello World" /><br /><br />
<p>Note that the js is not minified so it is readable. See <a href="hello.js">hellos.js</a> for the full source code.</p>

<div id="hello-win" class="x-hidden">
<div class="x-window-header">Hello Dialog</div>
<div id="hello-tabs">
<!-- Auto create tab 1 -->
<div class="x-tab" title="Hello World 1">
<p>Hello...</p>
</div>
<!-- Auto create tab 2 -->
<div class="x-tab" title="Hello World 2">
<p>... World!</p>
</div>
</div>
</div>
</body>
</html>


Thanks,
Dave.

thedave
23 Aug 2008, 3:16 PM
Problem solved. This time for real! ;)

It was this IE bug: http://extjs.com/forum/showthread.php?t=7912&highlight=createRange

Also, if you have this problem, it could be a charset problem. Because this IE bug also "fires" when there are non-tag elements before the <html> tag. Sometimes, if you mix charsets, you have some UTF8-BOM gibberish before your <html> which isn't even visible.