AnsweredAssumed Answered

Print templates with esri.request issue

Question asked by saqib4 on Oct 31, 2013
Latest reply on Nov 6, 2013 by JGravois-esristaff
When I use the ESRI sample Print templates with esri.request (https://developers.arcgis.com/en/javascript/jssamples/widget_print_esri_request.html), I copy the code into a local html file, the "print" button doesn't display, however when I put an alert box in line 79, this somehow causes it to work in FireFox. To make debugging easier, I have replaced the original console.log() method to alert().

Any ideas?


<!doctype html> <html>   <head>     <meta charset="utf-8">     <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">     <title></title>     <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/dojo/dijit/themes/tundra/tundra.css">     <link rel="stylesheet" href="http://js.arcgis.com/3.7/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; }       .shadow {         -moz-box-shadow: 0 0 5px #888;         -webkit-box-shadow: 0 0 5px #888;         box-shadow: 0 0 5px #888;       }       #map{ margin: 0; padding: 0; }       #feedback {         background: #fff;         color: #000;         position: absolute;         font-family: arial;         height: auto;         right: 20px;         margin: 5px;         padding: 10px;         top: 20px;         width: 300px;         z-index: 40;       }       #feedback a {         border-bottom: 1px solid #888;         color: #444;         text-decoration: none;       }       #feedback a:hover, #feedback a:active, #feedback a:visited {         border: none;         color: #444;         text-decoration: none;       }       #note { font-size: 80%; font-weight: 700; padding: 0 0 10px 0; }       #info { padding: 10px 0 0 0; }     </style>      <script src="http://js.arcgis.com/3.7/"></script>     <script>       var app = {};       require([         "esri/map", "esri/layers/FeatureLayer",          "esri/dijit/Print", "esri/tasks/PrintTemplate",          "esri/request", "esri/config",         "dojo/_base/array", "dojo/dom", "dojo/parser",          "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"       ], function(         Map, FeatureLayer,          Print, PrintTemplate,          esriRequest, esriConfig,         arrayUtils, dom, parser       ) {         parser.parse();          app.printUrl = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task";          esriConfig.defaults.io.proxyUrl = "/proxy";                  app.map = new esri.Map("map", {           basemap: "hybrid",           center: [-117.447, 33.906],           zoom: 17,           slider: false         });          // add graphics for pools with permits         var permitUrl = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/PoolPermits/MapServer/1";         var poolFeatureLayer = new FeatureLayer(permitUrl, {           "mode": FeatureLayer.MODE_SNAPSHOT         });   alert("Test"); // This is Line 79 ! This will work in FireFox, after commenting out, it will break         app.map.addLayer(poolFeatureLayer);          // get print templates from the export web map task         var printInfo = esriRequest({           "url": app.printUrl,           "content": { "f": "json" }         });         printInfo.then(handlePrintInfo, handleError);          function handlePrintInfo(resp) {           var layoutTemplate, templateNames, mapOnlyIndex, templates;            layoutTemplate = arrayUtils.filter(resp.parameters, function(param, idx) {             return param.name === "Layout_Template";           });                      if ( layoutTemplate.length == 0 ) {             alert("print service parameters name for templates must be \"Layout_Template\"");             return;           }           templateNames = layoutTemplate[0].choiceList;            // remove the MAP_ONLY template then add it to the end of the list of templates            mapOnlyIndex = arrayUtils.indexOf(templateNames, "MAP_ONLY");           if ( mapOnlyIndex > -1 ) {             var mapOnly = templateNames.splice(mapOnlyIndex, mapOnlyIndex + 1)[0];             templateNames.push(mapOnly);           }                      // create a print template for each choice           templates = arrayUtils.map(templateNames, function(ch) {             var plate = new PrintTemplate();             plate.layout = plate.label = ch;             plate.format = "PDF";             plate.layoutOptions = {                "authorText": "Made by:  Esri's JS API Team",               "copyrightText": "<copyright info here>",               "legendLayers": [],                "titleText": "Pool Permits",                "scalebarUnit": "Miles"              };             return plate;           });            // create the print dijit           app.printer = new Print({             "map": app.map,             "templates": templates,             url: app.printUrl           }, dom.byId("print_button"));           app.printer.startup();         }          function handleError(err) {           alert("Something broke: ", err);         }       });     </script>   </head>    <body class="tundra">     <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="feedback" class="shadow">           <h3>             Print Templates Created from Info Returned by the Print Service using              <a href="https://developers.arcgis.com/en/javascript/jsapi/namespace_esri.html#request">esri.request</a>           </h3>           <div id="info">             <div id="note">               Note:  This sample uses an ArcGIS Server version 10.1 export web map task.             </div>                          <!-- that will be used for the print dijit -->             <div id="print_button"></div>              <div id="info">               <a href="https://developers.arcgis.com/en/javascript/jsapi/printtemplate.html">Print templates</a> are generated                from the Export Web Map Task's <a href="http://sampleserver6.arcgisonline.com/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task">Layout_Template parameter</a>. This info is retrieved from the service                using <a href="https://developers.arcgis.com/en/javascript/jsapi/namespace_esri.html#request">esri.request</a>.              </div>            </div>         </div>       </div>     </div>   </body> </html>

Outcomes