title: Adding a print dijit in jQuery Dialog box
body: <p>I'm trying to add a esri print dijit to a dialog box when the user clicks a link.  The issue I'm having is the an error is being thrown such as "can not call method toLowerCase undefined.  I'm not sure what is happening or why this is happening.  When I comment out the printInfo then the map and legend render fine.  Soon as I try to put that back in the code the to lower case method of undefined error is called and i'm stuck</p>
  
  <p>Here I'm setting up my map then calling the print dijit</p>
  
  <pre><code>    function init(type, vid) {        
  
      map = new esri.Map("mapDiv", {
          basemap: "gray",
          sliderStyle: "large",
          center: [-95.625, 39.243],
          nav: false,
          logo: false,
          zoom: 7
      });//end base map
  
      dojo.connect(map, "onLoad", function () {
          console.log("base and feature layers added");
          $(document).ready();
      });  //end dojo.connect
  
      var upDateEnd = dojo.connect(fl, "onUpdateEnd", function () {
          dojo.disconnect(upDateEnd);
  
          var printInfo = esri.request({
              "url": app.printUrl,
              "content": { "f": "json" }
          });
          printInfo.then(handlePrintInfo, handleError);
      });//end update       
  
      drawFeatureLayer();               
  }//end init function
  </code></pre>
  
  <p>Here is where i call the open dialog it opens the map div and also shows the hidden legend for the map</p>
  
  <pre><code>    function openBox(v) {
      $("#mapDiv").dialog({
          autoOpen: false,
          height: 600,
          width: 900,
          title: "Map Profile"
      });
  
      $("#mapDiv").dialog("open");
      $("#legend").show();              
  }//end open box
  </code></pre>
  
  <p>Here is the HTML for the map that is opened:</p>
  
  <pre><code>&lt;div id="maps" &gt;
  &lt;div id="mapDiv" style="height:550px; width:475px; display:block;"&gt;
  
      &lt;div id="print_button"&gt;&lt;/div&gt;
          &lt;div id="legend" style=" position:absolute; bottom:25px; z-index:100; display:none;" &gt;        
              &lt;ul style="list-style-type:none;"&gt;
                  &lt;li&gt; 2-4&lt;/li&gt;
                  &lt;li&gt; 5-7&lt;/li&gt;
                  &lt;li&gt; 7-10&lt;/li&gt;                                                 
              &lt;/ul&gt;
          &lt;/div&gt;
  &lt;/div&gt;   
  </code></pre>
  
  <p></p>