Many editors struggle with the standard SharePoint taxonomy control. Large term sets quickly overwhelm the picker and slow down data entry. After a series of prototypes we opted for a dropdown experience that keeps the hierarchy but improves scannability.
The PnP Sample Branding.JSLink provides everything needed to make that change. The sample code serves as the foundation for the steps below.
Structure the term store
Organise the term store hierarchically so editors can follow the logic in the dropdown. Clean groupings make navigation far easier.
Implement the dropdown
Prepare the files
For this scenario you only need TaxonomyOverrides.js and ManagedMetadata.js. Upload both to the Style Library of your SharePoint test site. Afterwards add every internal field name that should behave like a dropdown to TaxonomyOverrides.js.
Reference the scripts in the forms
Add a Script Editor web part to the New and Edit forms and reference both files:
<script type="text/javascript" src="/sites/test/Style Library/Taxonomy/ManagedMetadata.js"></script>
<script type="text/javascript" src="/sites/test/Style Library/Taxonomy/TaxonomyOverrides.js"></script>As soon as the page is saved, the taxonomy field is rendered as a dropdown.
Result
Additional refinements
Extended use surfaced a few more improvements:
- Editors could not tell whether items had child terms, so the script now prepends a
>when additional levels exist. - Required-field validation did not run reliably and has been added back in.
OnChangedid not fire, which meant no custom logic could react to user input (e.g. hiding or showing dependent columns). This event is now triggered correctly.- Default values could not be set. The updated version supports that scenario as well.
Download the current script bundle at /wp-content/uploads/2020/08/ManagedMetadata.zip.
You can find more guidance on multi-select taxonomy fields in this article.
I hope these tips help you streamline your forms. If you have questions, leave a comment or send me a quick note.