nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Can't disable "Add feature" button in Editor widget

BrentGrossman

In my code (using API version 4.18), I'm using a WebScene and WebMap (toggling between 2d and 3d is supported) with many layers. I'd like for users to be able to edit, but not add to, features in one particular feature layer. However, I can't seem to be able to disable the "Add feature" button using addEnabled. Here's my code:

        window.locatesFeatureLayer = new this.FeatureLayer({
            url:
                "url to the feature layer in our portal"
        });

        editor = new this.Editor({
                view: view,
                container: editorContainer,
                layerInfos: [{
                    layer: window.locatesFeatureLayer,
                    addEnabled: false
                }]
       });
       editor.addEnabled = false; (//tried to set addEnabled here, too, but 
                                           no luck

Here's what the Editor widget looks like when I run my code (it's in an Expand widget, as you can see):

Even if I can disable "Add feature", that's not ideal, since the button is still visible in that case. What I'd really like is to hide or remove that button altogether.

My questions are,

Why am I not able to disable the "Add feature" button?
Is it possible to hide that button, in addition, or instead of, disabling it?
If the above isn't possible, can I maybe make the Editor window small enough to only show "Edit feature", but then expand that window when the form for editing is visible (after the user has selected a feature to edit)?
If none of the above is possible, can I implement my own editor widget, and if so, what available advice, direction, sample code, etc. is there for doing so?

Find more posts tagged with

Accepted answers

Kishore

Hi Brent,

I am not sure this will help your workflow. However, you can refer to the Editor widget API for disabling the actions by specifying the Allowed workflows:

const editor = new Editor({
  view: view,
  allowedWorkflows: ["update"] // allows only updates and no adds
});

Please refer to the link: esri-widgets-Editor.html activeWorkflow

Thank you.

All comments

BrentGrossman

@ArnoFiva, I was able to make "addEnabled: False" work on the Configurable Editor Widget sample, too, by putting it in both layers. My code gets many layers from the portal WebScene that it uses (most of which are not editable), so maybe that's the difference?

"allowedWorkflows" is a perfectly adequate solution for me, but I can probably provide more of my code, if you want to look at it to better understand why "addEnabled" didn't work for me, though I don't think I should post it here.

ArnoFiva

Thanks for the feedback @BrentGrossman and sorry I missed the fact that you also tried to pass addEnabled in the layerInfos. It would be good to see a complete sample as that should work. I've just tried it on the Configurable Editor Widget sample and this is what it looks like:

Using addEnabled on the layerInfos

Screen Shot 2021-11-22 at 3.40.15 PM.png

As @Kishore pointed out using allowedWorkflows directly on the Editor

Screen Shot 2021-11-22 at 3.40.50 PM.png

BrentGrossman

Thanks, @Kishore. Your solution works for me and seems like a more straightforward way to set the allowed actions than modifying the CSS. I did not notice allowedWorkflows when I originally looked at the Editor documentation, though it's one of the first listed properties.

@ArnoFiva's alternative of using layerInfos is something I'd already tried (see the code in my original post) without success.

I didn't accept Kishore's answer as the solution. Apparently here, unlike, for example, Stack Overflow, it's not only the original poster who can accept a solution. Anyway, thanks again.

ArnoFiva

As @Kishore already pointed out, using Editor.allowedWorkflows is the supported and recommended way to toggle which workflows are supported.

You can also tweak this on a per-layer basis using Editor.layerInfos :

const editor = new Editor({
  /* ... */
  layerInfos: [{
    layer: featureLayer,
    enabled: true, // default is true, set to false to disable editing functionality
    addEnabled: true, // default is true, set to false to disable the ability to add a new feature
    updateEnabled: false // default is true, set to false to disable the ability to edit an existing feature
    deleteEnabled: false // default is true, set to false to disable the ability to delete features
  }]
});

Hope this helps and makes your other Editor related questions obsolete @BrentGrossman, otherwise feel free to reach out again!

Kishore

Hi Brent,

I am not sure this will help your workflow. However, you can refer to the Editor widget API for disabling the actions by specifying the Allowed workflows:

const editor = new Editor({
  view: view,
  allowedWorkflows: ["update"] // allows only updates and no adds
});

Please refer to the link: esri-widgets-Editor.html activeWorkflow

Thank you.

BrentGrossman

Thanks. Pardon me if I'm being obtuse. It looks as if you edited the source for the Editor example at https://developers.arcgis.com/javascript/latest/sample-code/widgets-editor-configurable/live/, but I don't know how to relate that to my own code.

I'd expect I'd have some sort of CSS entry that begins with .esri-editor__feature-list-item. I did find some CSS that uses "[role=button]" and ":first-child", so I may be able to figure this out. Sorry if this is CSS 101, but it's not familiar to me.

RickeyFight

@BrentGrossman

I added to the element visibility: hidden;

BrentGrossman

Thanks very much. I think hiding the button would be fine--I don't need it for any layers. I looked at Editor.scss and didn't find references to the add and edit buttons. Can you give me more information about how I'd go about hiding the add button?

RickeyFight

@BrentGrossman

You can hide the button using css. But that would be fore all layers.

One other way would be to disable creating features on the service.

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.