IE10 Extjs 4.1.0 insertSibling not working correctly
I have the following piece of code:
var messageWrapper = {
tag: 'div'
};
var messageEl = cmp.errorEl.insertSibling(messageWrapper, "after");
cmp.messageEl = messageEl;
Ext.Array.each(me.displayProperties, function (property) {
var propertyConfig = {
tag: 'div',
style: {
display: 'none'
}
};
var newElement = messageEl.insertSibling(propertyConfig, "after");
newElement.addCls(property.classes);
var changeListener = me.buildChangeListener(newElement, property.name);
cmp.addListener('change', changeListener);
});
which worked fine under ExtJs 4.0.7 and still works fine under chrome.
The problem is that cmp.errorEl.insertSibling (messageWrapper, "after") returns null in IE, I could add an extra true parameter - then I would get a dom object, but I wouldn't be able to use extjs functions.
Do you have any ideas how I can fix this?
The fiddle is available at: https://fiddle.sencha.com/#fiddle/f1a
+3
source to share
1 answer
There is a bug in Ext.dom.Helper (ietable method) ExtJS 4.1.0. Apply this override to fix it:
(function() {
// kill repeat to save bytes
var detachedDiv = document.createElement('div');
Ext.define('Ext.override.dom.Helper', {
override: 'Ext.dom.AbstractHelper',
ieTable: function(depth, openingTags, htmlContent, closingTags){
detachedDiv.innerHTML = [openingTags, htmlContent, closingTags].join('');
var i = -1,
el = detachedDiv,
ns;
while (++i < depth) {
el = el.firstChild;
}
// If the result is multiple siblings, then encapsulate them into one fragment.
ns = el.nextSibling;
if (ns) {
el = document.createDocumentFragment();
while (ns) {
el.appendChild(ns);
ns = ns.nextSibling;
}
}
return el;
}
}, function() {
Ext.ns('Ext.core');
Ext.DomHelper = Ext.core.DomHelper = new this;
});
}());
+3
source to share