Ext js - el.ownerDocument.createRange () errors in IE 8

Question

HI, I am trying to dynamically add a form to a tab in Ext-js. (tab is already displayed). fyi, I use I use Ext 2.2.

The error occurs when during the tab.add function: that is:

function tabactivate(tab) { var newItem= new Ext.FormPanel(.....); **tab.add(newItem)**; //ERRORS HERE tab.doLayout(); } 

I get this error on line 247 of the ext-all-debug.js file which

 range = el.ownerDocument.createRange(); 

error (Object does not support this property or method.)

This works fine in Firefox, but breaks in IE8. Does anyone know a workaround for this?

thanks

Answer 1

It sounds very similar to the problem that I have encountered with ExtJS 2.2 and IE.

There seem to be many places in the ext code where you see this code:

 var td = document.createElement("td"); this.tr.insertBefore(td, this.tr.childNodes[index]); 

If in fact this does not work on IE, because "this.tr.childNodes ([0])" does not exist yet.

My workaround was to override the prototype (in my case insertButton () in Ext.Toolbar) to check if this.tr.childNodes ([0]) exists, using another function, or creating it, t exists.

I hope that I am right that this is the problem you are facing.

Answer 2

So, I found an old line that had a solution for me. http://www.extjs.com/forum/showthread.php?t=7912&highlight=createRange

Essentially, when I created the empty tabs, I had the my html property:

html: ' ' ,

after I either completely lost the property, or I changed it to

 html: '<span></span>' 

he stopped breaking.

thanks

Answer 3

IE (even 8) does not support the document.createRange() method.

You can try var supportsDOMRanges = document.implementation.hasFeature("Range", "2.0"); to find out if the browser supports DOM ranges by standard.