Question

Hi I am looking for tutorial based on Dojo 1.8.
What I am looking for is:- create and instantiate widget pragmatically after dojo page fully loaded and parsed, triggered after dojo/on button. I am not sure of which tutorial in Dojo website, for me to learn.

Please advise.
Thanks in advance.
Clement

Answer 1

There isn’t one tutorial that fully answer all your question but the following will be helpful:

• Dojo Events tutorial and dojo/on reference
• dojo/ready reference
• dojo/parser reference

To capture both the full loading of the page and parsing you need to use a combination of dojo/ready and dojo/parser. (I’m assuming that the parsing you refer to is the dojo widget parser, rather than the standard browser parsing of HTML).

To run code after parsing you’ll need to add parseOnLoad: false to your dojoConfig and run the parser manually; otherwise, there is no way of capturing when it is complete.

<script type="text/javascript" async="true">
    require([
        "dojo/ready",
        "dojo/parser",
        "dojo/on,
        "dojo/query"
    ], function(
        ready, parser, on, $
    ){
        ready(function(){
            // Only run after the page is fully loaded
            parser.parse().then(function(instances){
                // Only run after parser has parsed the page

                var myButton = $("#myButtonid");  // Find your button
                if(myButton.length > 0){ // Check button is found
                    on(myButton[0], "click", function(evt){

                        // ... add your code here to create and
                        //    instantiate widget 

                    });
                }
            });
        });
    }
</script>

Don’t forget that you need to turn off automatic parsing of widgets in you dojoConfig, hence, something like this (in the head):

<script type="text/javascript">
    dojoConfig= {
        "parseOnLoad": false,
        "async": true
        // ...other settings
    };
</script>