Enable only individual feature creation on Editor widget

589
6
12-14-2023 01:55 PM
LefterisKoumis
Occasional Contributor III

I'd like the users of the editor widget to create a feature, fill out the required fields and then submit it before they can create another feature. It seems by default, users can create multiple features before they can enter the field values which it can lead to lots of issues.

Apparently the desired workflow is the individual feature creation as described at this link.

However, on the same page it states that the type "create" is depreciated as of 4.23 and we should use the type "create-features" to create either individual or continuous features. But there is no mention of how to select the workflow to be individual or continuous. 

There are a similar posts  link#1  link#2   from  other users who experience the same issue.

@HeatherGonzago 

@AnneFitz 

 

0 Kudos
6 Replies
LefterisKoumis
Occasional Contributor III

Update. Until ESRI responds with a solution, I have this workaround. Please let me know if there are issues with this method. It was tested and it works as intended.

Workaround:

First create a global variable. I named it "creating" and set it to true.

Then, set the variable to false when the user completes the sketch of the new feature.

 

if (editorVM.state == 'creating-features' && editorVM.featureFormViewModel.feature && editorVM.featureFormViewModel.state == 'ready') 
{ editorVM.sketchViewModel.on("update", function (event) {
    if (editorVM.featureFormViewModel.state == "ready" && (editorVM.sketchViewModel.activeTool == "transform")) {
      creating = false}   
    }
_ _ _ _ _ _
_ _ _ _ _ _

 

Then, prevent the creation of new features by disabling the click event. Allow only reshaping the feature prior submitting.

 

view.hitTest(event).then((response) => {
   if (!creating) {
     if (!(editorVM.sketchViewModel.activeTool == "reshape")) {
         editorVM.sketchViewModel.cancel()
         event.stopPropagation
         return
     }
  }
_ _ _ _ _
_ _ _ _ _

 

When the user submit the form for the feature, you can change the "creating" variable to true so you can create more features if needed.

 

 editor.viewModel.featureFormViewModel.on('submit', _ => {
                    creating = true
_ _ _ _ 
_ _ _ _ 

 

 @JB19 @NicholasWright 

NicholasWright
New Contributor II

Hi @LefterisKoumis ! Thanks for the tag 🙂

I'm having trouble with your solution. Below is my interpretation of what you posted. I feel like something is missing before line 5, like that needs wrapped in an .on() call or something. I'm also primarily testing this against Point features, so I'm not sure if a Polyline/Polygon would make a difference here or not.

I also commented out line 5 (and it's ending bracket) to see what that would do. The `update` responds, and so does the `hitTest`, but it doesn't like `event.stopPropagation()` (I also tried `response.stopPropagation()` to be safe; no luck there either).

 

const editor = new Editor({ /* ...snip... */});
const editorVM = editor.viewModel;
let creationAvailable = true;

if (editorVM.state === 'creating-features' && editorVM.featureFormViewModel.feature && editorVM.featureFormViewModel.state === 'ready') {
    editorVM.sketchViewModel.on('update', (event) => {
        if (editorVM.featureFormViewModel.state === 'ready' && editorVM.sketchViewModel.activeTool === 'transform') {
            creationAvailable = false;
        }

        view.hitTest(event).then((response) => {
            if ( ! creationAvailable) {
                if (editorVM.sketchViewModel.activeTool !== 'reshape') {
                    editorVM.sketchViewModel.cancel();
                    event.stopPropagation();
                    return;
                }
            }
        });
    });
}

editorVM.featureFormViewModel.on('submit', () => (creationAvailable = true));

 

 

0 Kudos
LefterisKoumis
Occasional Contributor III

Hello Nicholas.

Sorry I forgot to include in the posting before line#5 

editorVM.watch(['state', 'featureFormViewModel.feature'], () => {

Also, for he hittest don't forget to include the return.

I attached a short video that shows that after you create the feature it let you only edit the geometry of the feature you created and it won't let you another feature unless if you complete the fields.

0 Kudos
NicholasWright
New Contributor II

No dice 😕  I made a barebones codepen for it though, maybe something will jump out to you.

https://codepen.io/Tickthokk/pen/rNROPvy

Thanks 🙂

0 Kudos
LefterisKoumis
Occasional Contributor III

ok. I had to change it a little bit. Since you are using points you don't have to worry about altering the geometry of the features like I showed on the video clip. The purpose of the return in the hittest is in case that you have more actions in the event.

https://codepen.io/lkoumis1/pen/bGZEwxK 

0 Kudos
NicholasWright
New Contributor II

Amazing 🎉 Confirmed that this works. Thanks a million!

Tagging @JB19 for visibility 😎