[CLOSED] Javascript error when running ext.net code in IE9 iframe

  1. #1

    [CLOSED] Javascript error when running ext.net code in IE9 iframe

    I have an issue running ext.net in iframe in IE 9 browser only. It works fine in other browsers and in IE 9 as standalone, not iframe.

    Click image for larger version. 

Name:	jserror.JPG 
Views:	28 
Size:	33.8 KB 
ID:	6393

    Any thoughts?
    Last edited by Baidaly; Jun 18, 2013 at 12:28 AM. Reason: [CLOSED]
  2. #2
    Code what is fire an error:
    return g.createElement("<rvml:"+e+' class="rvml">')
  3. #3
    Hi @livehealthierGF,

    What is the iframe's content?

    Could you, please, provide a test case?
  4. #4
    Looks like bug in sencha code:
    render: function (container) {
            var me = this,
                doc = Ext.getDoc().dom;
            // VML Node factory method (createNode)
            if (!me.createNode) {
                try {
                    if (!doc.namespaces.rvml) {
                        doc.namespaces.add("rvml", "urn:schemas-microsoft-com:vml");
                    }
                    me.createNode = function (tagName) {
                        return doc.createElement("<rvml:" + tagName + ' class="rvml">');
                    };
                } catch (e) {
                    me.createNode = function (tagName) {
                        return doc.createElement("<" + tagName + ' xmlns="urn:schemas-microsoft.com:vml" class="rvml">');
                    };
                }
            }
    
            if (!me.el) {
                var el = doc.createElement("div");
                me.el = Ext.get(el);
                me.el.addCls(me.baseVMLCls);
    
                // Measuring span (offscrren)
                me.span = doc.createElement("span");
                Ext.get(me.span).addCls(me.measureSpanCls);
                el.appendChild(me.span);
                me.el.setSize(me.width || 10, me.height || 10);
                container.appendChild(el);
                me.el.on({
                    scope: me,
                    mouseup: me.onMouseUp,
                    mousedown: me.onMouseDown,
                    mouseover: me.onMouseOver,
                    mouseout: me.onMouseOut,
                    mousemove: me.onMouseMove,
                    mouseenter: me.onMouseEnter,
                    mouseleave: me.onMouseLeave,
                    click: me.onClick
                });
            }
            me.renderAll();
        },
    doc.createElement("<rvml:" + tagName + ' class="rvml">');
    should be replaced by:

    var lh_rvm = g.createElement("rvml"); lh_rvm.className = "rvml";

    Is it any way to submit and get it fix by sencha?
    Last edited by Daniil; Jun 17, 2013 at 5:00 PM. Reason: Please use [CODE] tags
  5. #5
    Daniil,
    How to overload method render method?
  6. #6
    Please clarify, do you have such issue with online samples (https://examples2.ext.net , all online samples are opened in the seperate iframe)
  7. #7
    Quote Originally Posted by Vladimir View Post
    Please clarify, do you have such issue with online samples (https://examples2.ext.net , all online samples are opened in the seperate iframe)
    No issues with examples. Trying to do something like this on my page:
      Ext.define('App.patch.Ext.draw.engine.VML', {
                requires: [
                'Ext.draw.engine.VML'
                ]
            }, function () {
    
                Ext.draw.engine.Vml.override({
                    render: function (a) {
                        var c = this, g = Ext.getDoc().dom, b;
                        if (!c.createNode) {
                            try {
                                if (!g.namespaces.rvml) {
                                    g.namespaces.add("rvml", "urn:schemas-microsoft-com:vml");
                                }
                                c.createNode = function (e) {
                                    var lh_rvm = g.createElement("rvml:" + e);
                                    lh_rvm.className = "rvml";
                                    return lh_rvm;
                                };
                            } catch (d) {
                                c.createNode = function (e) {
                                    var lh_rvm = g.createElementNS("urn:schemas-microsoft.com:vml", e);
                                    lh_rvm.className = "rvml";
                                    return lh_rvm;
                                };
                            }
                        } if (!c.el) {
                            b = g.createElement("div");
                            c.el = Ext.get(b);
                            c.el.addCls(c.baseVmlCls);
                            c.span = g.createElement("span");
                            Ext.get(c.span).addCls(c.measureSpanCls);
                            b.appendChild(c.span);
                            c.el.setSize(c.width || 0, c.height || 0);
                            a.appendChild(b);
                            c.el.on({ scope: c, mouseup: c.onMouseUp, mousedown: c.onMouseDown, mouseover: c.onMouseOver, mouseout: c.onMouseOut, mousemove: c.onMouseMove, mouseenter: c.onMouseEnter, mouseleave: c.onMouseLeave, click: c.onClick, dblclick: c.onDblClick });
                        }
                        c.renderAll();
                    }
                });
            });
    but looks like error happened before my code. Is it any way to override it?
  8. #8
    It seems that your browser cannot parse ExtJS file, in this way you cannot override it because ExtJS resources are loaded first
    I am not sure whats wrong because I cannot reproduce the issue (and you cannot reproduce with our online samples)

    I guess that your webserver somehow modify resources (may be some IIS modules or your own http modules/filters)
    Can you provide online sample to test it?
  9. #9
    Just compared standalone and iframe version, looks like it standalone version generate svg chart:
    <svg id="ext-gen1178" style="width: 275px; height: 225px;" width="275" height="225" xmlns="http://www.w3.org/2000/svg" version="1.1">
    ..
    but somehow iframe(ie9) version generates IE8 version of chart:
    <div class=" x-vml-base" id="ext-gen1178" style="width: 275px; height: 225px;">
    <shape class="rvml x-vml-sprite" id="ext-sprite-1173" style="z-index: 0;">
  10. #10
    Found the issue. If you do not set <!DOCTYPE html> on page on IE9 in iframe it render page in quirks mode, what is brake functionality. Added doctype and everything works fine. You can close the topic

Similar Threads

  1. [CLOSED] [1.0] Javascript error when loading usercontrol from code
    By klaus.schwarz in forum 1.x Legacy Premium Help
    Replies: 17
    Last Post: Jul 12, 2010, 3:59 PM
  2. Replies: 4
    Last Post: Aug 19, 2009, 2:01 PM
  3. Replies: 2
    Last Post: Jul 01, 2009, 1:06 PM
  4. Getting exception error when running in .Net 2.0 runtime
    By stevejebson in forum 1.x Legacy Premium Help
    Replies: 15
    Last Post: Sep 16, 2008, 1:01 PM
  5. [CLOSED] Error after running new build
    By Jurke in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Sep 15, 2008, 8:07 AM

Posting Permissions