diff --git a/client/src/entrypoints/admin/telepath/widgets.js b/client/src/entrypoints/admin/telepath/widgets.js index 4dfe7fa504ea..8ccab127ab45 100644 --- a/client/src/entrypoints/admin/telepath/widgets.js +++ b/client/src/entrypoints/admin/telepath/widgets.js @@ -2,11 +2,12 @@ import { gettext } from '../../../utils/gettext'; class BoundWidget { - constructor(element, name, idForLabel, initialState, parentCapabilities) { + constructor(element, name, idForLabel, initialState, extraAttributes, parentCapabilities) { var selector = ':input[name="' + name + '"]'; this.input = element.find(selector).addBack(selector); // find, including element itself this.idForLabel = idForLabel; this.setState(initialState); + this.extraAttributes = extraAttributes; this.parentCapabilities = parentCapabilities || new Map(); } @@ -49,10 +50,17 @@ class Widget { boundWidgetClass = BoundWidget; - render(placeholder, name, id, initialState, parentCapabilities) { + render(placeholder, name, id, initialState, extraAttributes, parentCapabilities) { var html = this.html.replace(/__NAME__/g, name).replace(/__ID__/g, id); var idForLabel = this.idPattern.replace(/__ID__/g, id); var dom = $(html); + + // Add any extra attributes we received to the HTML of the widget + if (typeof extraAttributes === "object") { + Object.entries(extraAttributes).forEach(([key, value]) => { + dom.attr(key, value) + }) + } $(placeholder).replaceWith(dom); // eslint-disable-next-line new-cap return new this.boundWidgetClass( @@ -60,6 +68,7 @@ class Widget { name, idForLabel, initialState, + extraAttributes, parentCapabilities, ); } @@ -349,7 +358,7 @@ class DraftailRichTextArea { this.options = options; } - render(container, name, id, initialState, parentCapabilities) { + render(container, name, id, initialState, extraAttributes, parentCapabilities) { const input = document.createElement('input'); input.type = 'hidden'; input.id = id;