CODEWITHSUNDEEP
javascriptinternet-explorerrecursiondojowidget
Ggilmann
Ggilmann

Reputation: 79

Dojo Widget - Silent fail between BuildRendering and PostCreate

I'm trying to develop a table of content style widget for a map in my web application. The widgets works quite well in Chrome and FireFox but fails silently in internet explorer 8 (I have read that so many times while developping this application!)

I'm using the dojo framework and I figured out that it fails between the BuildRendering and PostCreate methods of the widget lifecycle. The widget is created using a graph structure so it is recursive. Does anyone have any idea what can cause failure between these two methods of the widget life cycle?

I have read in some places that the template may be a problem, so I've included it following my Node code.

Here's a simplified version of the widget so you can maybe get an idea of what's happening :

define(['dojo/_base/declare', "dijit/_WidgetBase", "dijit/_TemplatedMixin", 
        "dijit/_WidgetsInTemplateMixin", "dojo/text!./templates/_Node.html"], 

function (declare, _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, template) {

    var _Node = declare ([_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin], { 

        templateString : template,
        _childNodes : [],

        constructor : function (params, srcNodeRef) {
            lang.mixin(this, params);   
            this.inherited(arguments);
        },

        buildRendering: function (){
            this.inherited(arguments);
            // Execution leaves this function but never launches postCreate()
            // buildRendering is not actually there in my code, I just have it here for 
            // debugging this particular problem.
        },

        postCreate : function () { 
            // Execution never reaches this point in IE8 (probably 7 and 9 as well)
            var newParams = {
                "Para1": "Value1",
                "Para2": "Value2"
            }
            var newNode = new Node(newParams, this.containerNode);
            this._childNodes.push(newNode);
        }
    });

    return _Node;

});

And here's the template it uses:

<div>
    <div data-dojo-attach-point="rowNode" data-dojo-attach-event="onclick:_onClick">
        <span data-dojo-attach-point="contentNode">
            <span data-dojo-attach-point="checkContainerNode"></span>
            <img src="${_blankGif}" alt="" data-dojo-attach-point="iconNode">
            <span data-dojo-attach-point="labelNode"></span>
        </span>
    </div>
    <div data-dojo-attach-point="containerNode" style="display: none;"></div>
</div>

So my node follows this structure but like I said, silently fails between buildRendering and postCreate in Internet Explorer. I've spent quite a bit of time on this already. I hope someone can give me a hand here.

And please don't look at the syntax too much, I copy pasted parts of my code but I modified it heavily for clarity.

Thanks,

Ggilmann

Upvotes: 0

Views: 1318

Answers (1)

Craig Swing
Craig Swing

Reputation: 8162

You do not have to call this.inherited(arguments); in the constructor. Dojo will automatically chain constructors.

http://dojotoolkit.org/reference-guide/1.8/dojo/_base/declare.html#id8

You also need to add this.inherited(arguments); to postCreate.

Your template does not have a closing tag for <img>.

Upvotes: 1

Related Questions