Clearing Graphics in WAB custom widget

[RichelleSpry]

I am having issues with clearing graphics in a custom WAB app.

I have been using this.map.graphics.clear() but I keep getting an Uncaught Error.

The functionality I am after is just allowing a user to draw a polygon, and clear the results. I hope to add undo/redo, and limiting it to a single feature later.

Attached is the widget, with the code changes in widget.js and widget.html. My experience with dojo/esi/etc. is limited, and I am sure it's something small I've just missed.

I would appreciate some help. Thx!

[RobertScheitlin__GISP]

Richelle,

   I don't see the attachments. But I can pretty much guess your issue is a code scope issue. If you are executing the this.map.graphics.clear(); inside a function handler then the scope of "this" is changed to the scope of that return function and this.map is undefined. For situations like this you use

lang.hitch(this, function(){
  this.map.graphics.clear();
});‍‍‍

[RichelleSpry]

I suspect you are right, but would that go inside or outside the function? I tried both options with no success.

(I have now reattached the file)

Thanks

[RobertScheitlin__GISP]

Richelle,

   Here is the change needed:

      on(dom.byId("Clearbtn"), "click", lang.hitch(this, function(evt){
        clearGraphic();
      }));‍‍‍

[RichelleSpry · Accepted solution]

I changed it to below, and is now working:

on(dom.byId("Clearbtn"), "click", lang.hitch(this, function(evt){
   this.map.graphics.clear();
}));

Thanks Robert

[RobertScheitlin__GISP]

Richelle,

   If you are going to mark your own reply as the correct answer then I would be good to at least mark my reply that lead you to the correct answer as helpful.