Managed metadata disable issue

Forms SharePoint 2019/SE
1

Hi,
I have few managed metadata columns with multi select options. I am trying to disable the field so that user should not be able to change selection in edit form.

I tried the code as mentioned in this article Managed Metadata — Plumsail SharePoint Forms Documentation

However the field is still editable. The code only disables the corner button with tag icon, but it is still possible to remove sected terms by clicking on delete icons on each term or clear textbox button.

image

Is there another way to fix this?

2

Dear @sandeep.bari,
This is SharePoint 2019, right? You can add an overlay with JavaScript which will prevent users from clicking on the field.

We're also working on a major update for SharePoint 2019, so it will likely change how the field works and might even fix the issue outright. It is expected in a month or two.

3

Hi,
Yes, it’s in SharePoint server 2019/SE.

I would really appreciate if you have an example of overlay.

Thank you :blush:

4

Dear @sandeep.bari,
Let's start with something simple, try the following:

fd.field('Multimeta').$el.setAttribute('style','pointer-events: none;');

And the following to make it clickable again:

fd.field('Multimeta').$el.setAttribute('style','pointer-events: auto;');

And if you want to disable everything, try the following:

fd.field('Multimeta').$el.setAttribute('style','pointer-events: none;');
fd.field('Multimeta').$el.querySelector('input').disabled = true;
fd.field('Multimeta').$el.querySelector('.k-multiselect-wrap').classList.add('k-state-disabled');

Otherwise users might still tab into field or find other ways to edit it.

Let me know how it goes!

5

Hi,
I tried the code to disable everything. It gives errors on both of the below lines.

fd.field('Multimeta').$el.querySelector('input').disabled = true;
TypeError: Cannot set properties of null (setting 'disabled')

fd.field('Multimeta').$el.querySelector('.k-multiselect-wrap').classList.add('k-state-disabled');
TypeError: Cannot read properties of null (reading 'classList')
6

I figured it out now.

Following code works to disable the field. The querySelector expects 'select' control instead 'input.

fd.field('Multimeta').disabled = true;
fd.field('Multimeta').$el.querySelector('select').setAttribute('readonly', 'readonly');

I am using readonly instead disable, otherwise the whole text field becomes grey including selected option's background.

Thank you for your support.

1 Like