after copying the code from This Code sample and attempting to convert the code to Web App builder my widget refuses to load. I get a pop-up that says " Create widget error" and in the console i am getting "Error: uniqName_8 template:config.configText"
I also do not see how I can add the html to widget.js. I have attached my widget.js code below:
define(['dojo/_base/declare',
'jimu/BaseWidget',"esri/map",
"esri/toolbars/draw",
"esri/toolbars/edit",
"esri/graphic",
"esri/config",
"esri/layers/FeatureLayer",
"esri/symbols/SimpleMarkerSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/symbols/SimpleFillSymbol",
"esri/dijit/editing/TemplatePicker",
"dojo/_base/array",
"dojo/_base/lang",
"dojo/parser",
"dijit/registry",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dijit/form/Button",
"dojo/domReady!"],
function(declare, BaseWidget, map, draw, edit, graphic, config,FeatureLayer, SimpleMarkerSymbol,SimpleLineSymbol,SimpleFillSymbol,
TemplatePicker,array,lang,parser,registry,BorderContainer,ContentPane,Button,domReady) {
//To create a widget, you need to derive from BaseWidget.
return declare([BaseWidget], {
// DemoWidget code goes here
//please note that this property is be set by the framework when widget is loaded.
//templateString: template,
baseClass: 'jimu-widget-ROP',
postCreate: function() {
this.inherited(arguments);
console.log('postCreate');
},
startup: function() {
this.inherited(arguments);
this.mapIdNode.innerHTML = 'map id:' + this.map.id;
require(["jimu/LayerNode"], function(LayerNode) { /* code goes here */ });
var map = this.map;
console.log('startup');
},
_initEditing: function(evt){
console.log("InitEditing",evt);
var currentLayer = null;
var layers = arrayUtils.map(evt.layers, function(result){
return result.layer;
});
console.log("layers", layers);
var editToolbar = new Edit(this.map);
editToolbar.on("deactivate", function(evt){
currentLayer.applyEdits(null,[evt.graphic], null);
});
arrayUtils.forEach(layers,function(layer){
var editingEnabled = false;
layer.on("dbl-click",function(evt){
event.stop(evt);
if (editingEnabled == false){
editingEnabled = true;
editToolbar.activate(Edit.EDIT_VERTICES , evt.graphic);
}
else{
currentLayer = this;
editToolbar.deactivate();
editingEnabled = false;
}
});
});
var templatePicker = new TemplatePicker({
FeatureLayer: layers,
rows: "auto",
columns: 2,
grouping: true,
style: "height: auto; overflow: auto;"
}, "templatePickerDiv");
templatePicker.startup();
var drawtoolbar = new Draw(this.map);
var selectedTemplate;
templatePicker.on ("Selection-Change", function(){
if (templatePicker.getSelected()){
selectedTemplate = templatePicker.getSelected();
}
switch (selectedTemplate.featureLayer.geometryType) {
case "esriGeometryPoint":
drawToolbar.activate(Draw.POINT);
break;
case "esriGeometryPolyline":
drawToolbar.activate(Draw.POLYLINE);
break;
case "esriGeometryPolygon":
drawToolbar.activate(Draw.POLYGON);
break;
}
});
drawToolbar.on("draw-end", function(evt){
drawToolbar.deactivate();
editToolbar.deactivate();
var newAttributes = lang.mixin({}, selectedTemplate.template
.prototype.attributes);
var newGraphic = new Graphic(evt.geometry, null, newAttributes);
selectedTemplate.featureLayer.applyEdits([newGraphic],null,null);
});
}
});
});