I would like to disable input fields for managed metadata from the term store in a new item or edit item form on a custom list.
How could I do this with javascript and jquery?
Should work in Chrome and IE.
-
1What code have you tried? – Danny '365CSI' Engelman Dec 23 '15 at 13:49
This can be done quite easily with jquery. If you take a look at the field with your browser's developer tools SharePoint puts the MMS field into a div with the title being the display name of the field. As an example, my form as a MMS field called Security on it.
When I look at the browser tools I see this:
<div title="Security" class="ms-taxonomy-fieldeditor ms-taxonomy-fieldeditor-standard" style="width: 364px;"></div>
I can add the following jquery to disable that field:
$("div[title='Security']").prop("disabled",true);
However I am not done as the image is still active and can set the value of the field.
To take care of that, I simply grab the parent div, find the img within and hide it:
$("div[title='Security']").parent().find('img').hide();
Hope that helps.
-
This is not working in Chrome and in IE the field does not get the "disabled look" (greyed out like other fields). But yes in IE you cannot change the value of the field anymore, but this is not enough. – Florian Leitgeb Dec 28 '15 at 11:15
Every textbox that is made out of a div in Sharepoint, has a div element as container and a div for textbox and span for the text in it.
The property you have to disable for the div in the container is the contenteditable property.
$("div[title='field name']").children().prop("contenteditable",false);
So this is my answer and it works in Chrome and IE. It is just not getting the disabled look as the other fields, but you can apply some CSS on it to achieve the look.
For the image of the term store selector just use:
$("div[title='field name']").parent().find('img').hide();
