Community
Select to view content in your preferred language

Web AppBuilder Custom Widget - Selecting feature after applyEdits

2754
10
Jump to solution
05-31-2019 08:26 AM
MarkEastwood
by
Frequent Contributor
‎05-31-2019 08:26 AM

I am trying to create a custom widget that allows users to copy and paste a record that has the same attributes and geometry. The copy and paste part of the widget is working but I also want the popup to appear for the newly created feature after it has been added. Originally, the section of code that I am having problems with worked without the popup appearing ...

_copyFeature: function() {

        this.inherited(arguments); 
		
        this.targetLayer.applyEdits([this.featureGraphic], null, null, this._onEditSuccess()); 
},


_onEditSuccess: function() {

        this.inherited(arguments);
				
        this.map.graphics.clear();
        this.map.setExtent(this.map.extent)

        this._postResults("<span style='color:#3ca553;'>Copied " + this.sourceLayer.name + ' Site Number - ' + this.featureGraphic.attributes.site_num + " to " + this.targetLayerName + "</span><br>");
		
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

The code I am using to get the popup to appear is below. The problem is, the popup is showing the feature that I am copying not the newly added record. 

_copyFeature: function() {

    this.inherited(arguments); 
		
    this.targetLayer.applyEdits([this.featureGraphic], null, null, this._onEditSuccess()); 
		
},

_onEditSuccess: function() {

    this.inherited(arguments);
    this.targetLayer.refresh();
		
    var query = new Query();
    query.geometry = this.featureGraphic.geometry;
		
    this.targetLayer.selectFeatures(query, this.targetLayer.SELECTION_NEW); 
		
    this.feature = this.targetLayer.getSelectedFeatures();
		
    var selectLength = this.feature.length; 
		
    //console.log(selectLength);
    //console.log(this.feature);
		
    this.feature = this.targetLayer.getSelectedFeatures()[selectLength];
			
    this.map.infoWindow.setFeatures([this.feature]);
    this.map.infoWindow.show(this.featureGraphic.geometry);
		
    this.map.graphics.clear();
    this.map.setExtent(this.map.extent)

    this._postResults("<span style='color:#3ca553;'>Copied " + this.sourceLayer.name + ' Site Number - ' + this.featureGraphic.attributes.site_num + " to " + this.targetLayerName + "</span><br>");
		
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

It appears like the edit is not being applied before the _onEditSuccess() is being run. I tried using 'edits-complete' so the _onEditSuccess() would run after the edit was completed but I had no luck. Maybe I am going about this the wrong way. Any suggestions would be appreciated. 

0 Kudos
10 Replies
MarkEastwood
by
Frequent Contributor
‎06-04-2019 02:41 PM

That worked great, Robert!

I was able to get the desired behavior with the following code updates/additions.

      _copyFeature: function() {

        this.inherited(arguments); 
		
        this.targetLayer.applyEdits([this.featureGraphic], null, null, lang.hitch(this, this._onEditSuccess), lang.hitch(this, this._onEditError)); 
		
      },

      _onEditError: function(err){
        console.error(err);
      },

      _onEditFail: function(e) {

        this.inherited(arguments);

        this._postResults("<span style='color:#c13333;'>" + e.name + ": " + e.message + "</span><br>");

      },

      _onEditSuccess: function(adds) {

        this.inherited(arguments);
        
        var query = new Query();
        query.where = "OBJECTID = " + adds[0].objectId;

        this.targetLayer.clearSelection();
        
        this.targetLayer.selectFeatures(query, this.targetLayer.SELECTION_NEW, lang.hitch(this, this._onSelectSuccess), this._onSelectError); 
		
        this.map.graphics.clear();
        this.map.setExtent(this.map.extent)

        
		
      },

      _onSelectSuccess: function(suc){

        this.map.infoWindow.setFeatures([this.targetLayer.getSelectedFeatures()[0]]);
        this.map.infoWindow.show(this.targetLayer.getSelectedFeatures()[0].geometry);
		
        this.map.graphics.clear();
        this.map.setExtent(this.map.extent)

        this._postResults("<span style='color:#3ca553;'>Copied " + this.sourceLayer.name + ' Site Number - ' + this.featureGraphic.attributes.site_num + " to " + this.targetLayerName + "</span><br>");
      },

      _onSelectError: function(err){
        console.log(err);
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍
0 Kudos