Load Dojo from CDN using jQuery

Load Dojo from CDN using jQuery

Here is the Dojo example that perfectly works  

   
    
    
  1. <!DOCTYPE HTML>
    2. 
    
  2. <html lang="en">
    3. 
    
  3.  <head>
    4. 
    
  4.  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.8.3/dijit/themes/claro/claro.css" media="screen">
    5. 
    
  5.  <script type="text/javascript">
    6. 
    
  6.  dojoConfig = {
    7. 
    
  7.  parseOnLoad: false,
    8. 
    
  8.  async: true
    9. 
    
  9.  };
    10. 
    
  10.  </script> 
    11. 
    
  11.  <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.8.3/dojo/dojo.js" type="text/javascript"></script>
    12. 
    
  12.  <script type="text/javascript">
    13. 
    
  13.  /// Require the registry, parser, Dialog, and wait for domReady
    14. 
    
  14.  require(["dijit/registry", "dojo/parser", "dojo/json", "dojo/_base/config", "dijit/Dialog"], function (registry, parser, JSON, config) {
    15. 
    
  15.  // Explicitly parse the page
    16. 
    
  16.  parser.parse();
    17. 
    
  17.  // Find the dialog
    18. 
    
  18.  var dialog = registry.byId("dialog");
    19. 
    
  19.  // Set the content equal to what dojo.config is
    20. 
    
  20.  dialog.set("content", "<b>it works!</b>");
    21. 
    
  21.  // Show the dialog
    22. 
    
  22.  dialog.show();
    23. 
    
  23.  });
    24. 
    
  24.  </script>
    25. 
    
  25.  </head>
    26. 
    
  26.  <body class="claro">
    27. 
    
  27.  <div id="dialog" data-dojo-type="dijit.Dialog"></div>
    28. 
    
  28.  </body>
    29. 
    
  29. </html>
    30.

now I want to modify it and load Dojo dynamically using jQuery. Here is the example how I do this:  

    
    
     
  1. <!DOCTYPE HTML>
    2. 
     
  2. <html lang="en">
    3. 
     
  3. <head>
    4. 
     
  4.  <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.8.3/dijit/themes/claro/claro.css" media="screen">
    5. 
     
  5.  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    6. 
     
  6.  <script type="text/javascript">
    7. 
     
  7.  $(document).ready(function () {
    8. 
     
  8.  dojoConfig = {
    9. 
     
  9.  parseOnLoad: false,
    10. 
     
  10.  async: true
    11. 
     
  11.  };
    12. 
     

    13. 
     
  13.  $.getScript("http://ajax.googleapis.com/ajax/libs/dojo/1.8.3/dojo/dojo.js")
    14. 
     
  14.  .done(function (script, textStatus) {
    15. 
     
  15.  /// Require the registry, parser, Dialog, and wait for domReady
    16. 
     
  16.  require(["dijit/registry", "dojo/parser", "dojo/json", "dojo/_base/config", "dijit/Dialog"], function (registry, parser, JSON, config) {
    17. 
     
  17.  // Explicitly parse the page
    18. 
     
  18.  parser.parse();
    19. 
     
  19.  // Find the dialog
    20. 
     
  20.  var dialog = registry.byId("dialog");
    21. 
     
  21.  // Set the content equal to what dojo.config is
    22. 
     
  22.  dialog.set("content", "<b>it works!</b>");
    23. 
     
  23.  // Show the dialog
    24. 
     
  24.  dialog.show();
    25. 
     
  25.  });
    26. 
     
  26.  })
    27. 
     
  27.  .fail(function (jqxhr, settings, exception) {
    28. 
     
  28.  alert('Cannot load Dojo.js');
    29. 
     
  29.  });
    30. 
     
  30.  });
    31. 
     
  31.  </script>
    32. 
     
  32. </head>
    33. 
     
  33. <body class="claro">
    34. 
     
  34.  <div id="dialog" data-dojo-type="dijit.Dialog">
    35. 
     
  35.  </div>
    36. 
     
  36. </body>
    37. 
     
  37. </html>
    38. 
     

    39.

but looks like I do something wrong cause it raises the next error: 

  1. NotFoundError: Node was not found
  2. http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js
  3. Line 2

I suspect that Dojo is not ready yet but maybe I'm wrong... Is it possible to use jQuery to load Dojo dynamically at all?