AnsweredAssumed Answered

Print Dijit Example not working in IE 8

Question asked by schlot on May 20, 2013
Latest reply on May 22, 2013 by schlot
I have a basic print example  based on http://help.arcgis.com/en/webapi/javascript/arcgis/jssamples/widget_print_esri_request.html, but I have changed out the webmap for a standard JS map with arcdynamicservicelayers etc.   This works just fine in Firefox.  When I try the sample code in IE 8, it doesn't look to load the esri.dijit.Print I created.  Instead, looking at the IE Developers Tools, I'm getting errors for 'Object doesn't support this property or method' . 

The Print button I expect to see never loads and neither does my map.  I've played with a couple of different version of the API, but that doesn't seem to help. 

This must work in IE.  Maybe it's something small I just haven't spotted yet? 

<!DOCTYPE html> <html>   <head>     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">     <meta http-equiv="X-UA-Compatible" content="IE=7,IE=9">      <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">     <title>Print Digit Sample</title>          <link type="text/css" rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dijit/themes/claro/claro.css">      <link type="text/css" rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css">      <style>       html, body { height: 100%; width: 100%; margin: 0; padding: 0; }       h3 { margin: 0 0 5px 0; border-bottom: 1px solid #444; padding: 0 0 5px 0; text-align: center; }        #map{ margin: 0; padding: 0; }       #printDiag {         background: #fff;         border: solid;         border-width: 1px;         color: #000;         font-family: arial;         height: auto;         right: 30px;         top: 30px;         margin: 5px;         padding: 10px;         position: absolute;         width: 300px;         z-index: 40;        #note { font-size: 80%; font-weight: 700; padding: 0 0 10px 0; }       #info { padding: 10px 0 0 0; }     </style>           <script type="text/javascript">             var dojoConfig = {                 parseOnLoad: true             };         </script>         <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2">         </script>     <script>       dojo.require("dijit.layout.BorderContainer");       dojo.require("dijit.layout.ContentPane");       dojo.require("esri.arcgis.utils");       dojo.require("esri.dijit.Print");        var pathName = "https://myserver.gov";       var printUrl; printUrl = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task";         function init(){                  esri.config.defaults.io.proxyUrl = "proxy/proxy.ashx";         spatialReference = new esri.SpatialReference({             wkid: 102100         });         startExtent = new esri.geometry.Extent(-10723197, 4186914, -9829190, 4992866, spatialReference);         map = new esri.Map("map", {             extent: startExtent });                  countyLayer = new esri.layers.ArcGISDynamicMapServiceLayer(pathName + "/ArcGIS/rest/services/BaseMap/county_simple/MapServer", {             id: "countyLayer"         });         map.addLayer(countyLayer);         createPrintDijit("This is my Title");     }       function createPrintDijit(printTitle) {         var layoutTemplate, templateNames, mapOnlyIndex, templates;                  // create an array of objects that will be used to create print templates         var layouts = [           {              "name": "Letter ANSI A Landscape",              "label": "Landscape - PDF",              "format": "pdf",              "options": {                "legendLayers": [], // empty array means no legend               "scalebarUnit": "Miles",               "titleText": printTitle ,               "copyrightText": "Missouri Office of Geospatial Information"                            }           }, {             "name": "Letter ANSI A Portrait",              "label": "Portrait - PDF",              "format": "pdf",              "options":  {                "legendLayers": [],               "scaleBarUnit": "Miles",               "titleText": printTitle ,               "copyrightText": "Missouri Office of Geospatial Information"             }           }         ];                  // create the print templates, could also use dojo.map         templates = [];         dojo.forEach(layouts, function(lo) {           var t = new esri.tasks.PrintTemplate();           t.layout = lo.name;           t.label = lo.label;           t.format = lo.format;           t.layoutOptions = lo.options;           templates.push(t);         });          var printer = new esri.dijit.Print({           "map": map,           "templates": templates,           url: printUrl         }, dojo.byId("print_button"));                  printer.startup();       }        dojo.ready(init);     </script>   </head>     <body class="claro">     <div data-dojo-type="dijit.layout.BorderContainer"          data-dojo-props="design:'headline',gutters:false"          style="width: 100%; height: 100%; margin: 0;">       <div id="map"            data-dojo-type="dijit.layout.ContentPane"            data-dojo-props="region:'center'">          <div id="printDiag" >           <h3>            Creating Map Output           </h3>           <div id="info">             <div id="note">               To Use:  Click the print button to choose either Landscape or Portrait format.                <br><br>Once your PDF is generated, the print button will change link that says Printout.               Click it to view your PDF.             </div>                          <!-- that will be used for the print dijit -->             <div id="print_button" ></div>           </div>         </div>       </div>     </div>   </body>  </html>

Outcomes