# Non-breaking space is not treated in ui\_update.label

**URL:** <https://discourse.nodered.org/t/non-breaking-space-is-not-treated-in-ui-update-label/92071>\
**Category:** Dashboard\
**Tags:** dashboard-2\
**Created:** [30 September 2024 09:05 UTC](https://discourse.nodered.org/t/non-breaking-space-is-not-treated-in-ui-update-label/92071 "2024-09-30T09:05:34Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![selwynjackson](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/selwynjackson/32/94976_2.png) [@selwynjackson](https://discourse.nodered.org/u/selwynjackson)\
**Post date:** [30 September 2024 09:05 UTC](https://discourse.nodered.org/t/non-breaking-space-is-not-treated-in-ui-update-label/92071/1 "2024-09-30T09:05:34Z")

</div>

I am trying to space fields in a ui-text node. The msg.payload accepts '&nbsp' as a space, but the msg.ui\_update.label does not. Is there any other way to get multiple spaces into the label?

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [30 September 2024 09:22 UTC](https://discourse.nodered.org/t/non-breaking-space-is-not-treated-in-ui-update-label/92071/2 "2024-09-30T09:22:34Z")

</div>

Hi @selwynjackson - welcome to the community.

I actually went to answer, \_"just include spaces in the `msg.payload`, e.g. `"My Payload"`, but you're right, that clears the spaces, and from research, is actually just how HTML works.

I thought we parsed that `label` content as HTML, but it appears we do not. I'll get a bug/issue opened to get that resolved.

Update: Issue Opened: [Support HTML in ui\_update.label for UI Text node · Issue #1346 · FlowFuse/node-red-dashboard · GitHub](https://github.com/FlowFuse/node-red-dashboard/issues/1346)

---

<div class="post-metadata">

**Author:** ![selwynjackson](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/selwynjackson/32/94976_2.png) [@selwynjackson](https://discourse.nodered.org/u/selwynjackson)\
**Post date:** [30 September 2024 09:26 UTC](https://discourse.nodered.org/t/non-breaking-space-is-not-treated-in-ui-update-label/92071/3 "2024-09-30T09:26:07Z")

</div>

Thank you, @joepavitt

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [10 October 2024 21:37 UTC](https://discourse.nodered.org/t/non-breaking-space-is-not-treated-in-ui-update-label/92071/4 "2024-10-10T21:37:04Z")

</div>

> [@joepavitt](#):
>
> Update: Issue Opened

Pull request is created and ready for review:

> <https://github.com/FlowFuse/node-red-dashboard/pull/1382>
>
> \## Description
> 
> This PR adds support for html in the label for following ui no…de types:
> + ui-number-input
> + ui-dropdown
> + ui-button-group
> + ui-radio-group
> + ui-slider
> + ui-switch
> + ui-text
> + ui-text-input
> 
> The following demo shows how to change from the static labels (from the config screen), to plain text labels and finally to html labels:
> 
> !\[dynamic\_labels\](https://github.com/user-attachments/assets/f167d22e-2860-4b5a-9837-1de154c372d9)
> \`\`\`
> \[{"id":"7b2f3c4e68f76fc6","type":"ui-slider","z":"4aad778b57d4f47b","group":"bd4b3eed126bd60e","name":"Slider","label":"Static label","tooltip":"","order":6,"width":0,"height":0,"passthru":false,"outs":"all","topic":"topic","topicType":"msg","thumbLabel":"true","showTicks":"always","min":0,"max":10,"step":1,"className":"","iconPrepend":"","iconAppend":"","color":"","colorTrack":"","colorThumb":"","x":1950,"y":2120,"wires":\[\[\]\]},{"id":"952c3a4bc1aedcb9","type":"ui-switch","z":"4aad778b57d4f47b","name":"Switch","label":"Static label","group":"bd4b3eed126bd60e","order":7,"width":0,"height":0,"passthru":false,"decouple":false,"topic":"topic","topicType":"msg","style":"","className":"","clickableArea":"switch","onvalue":"true","onvalueType":"bool","onicon":"","oncolor":"","offvalue":"false","offvalueType":"bool","officon":"","offcolor":"","x":1950,"y":2160,"wires":\[\[\]\]},{"id":"3cab92ecc8c62250","type":"ui-radio-group","z":"4aad778b57d4f47b","group":"bd4b3eed126bd60e","name":"Radio group","label":"Static label","order":5,"width":0,"height":0,"columns":1,"passthru":false,"options":\[{"label":"Value 1","value":"value1","type":"str"},{"label":"Value 2","value":"value2","type":"str"}\],"payload":"","topic":"topic","topicType":"msg","className":"","x":1970,"y":2080,"wires":\[\[\]\]},{"id":"805544beee60b59e","type":"ui-dropdown","z":"4aad778b57d4f47b","group":"bd4b3eed126bd60e","name":"Dropdown (combobox)","label":"Static label","tooltip":"","order":3,"width":0,"height":0,"passthru":false,"multiple":false,"chips":false,"clearable":false,"options":\[{"label":"Value 1","value":"value1","type":"str"},{"label":"Value 2","value":"value2","type":"str"}\],"payload":"","topic":"topic","topicType":"msg","className":"","typeIsComboBox":true,"x":2000,"y":2000,"wires":\[\[\]\]},{"id":"3957a5ca24d0a8c0","type":"ui-button-group","z":"4aad778b57d4f47b","name":"Button group","group":"bd4b3eed126bd60e","order":2,"width":6,"height":1,"label":"Static label","rounded":true,"useThemeColors":true,"passthru":false,"options":\[{"label":"label A","icon":"","value":"option\_0","valueType":"str","color":"#009933"},{"label":"label B","icon":"","value":"option\_1","valueType":"str","color":"#999999"}\],"topic":"topic","topicType":"msg","x":1970,"y":1960,"wires":\[\[\]\]},{"id":"d06b475b0dc03d4b","type":"ui-number-input","z":"4aad778b57d4f47b","group":"bd4b3eed126bd60e","name":"Number input","label":"Static label","order":1,"width":0,"height":0,"topic":"topic","topicType":"msg","min":0,"max":10,"step":1,"tooltip":"","passthru":true,"sendOnBlur":true,"sendOnEnter":true,"className":"","clearable":false,"icon":"","iconPosition":"left","iconInnerPosition":"inside","spinner":"default","x":1980,"y":1920,"wires":\[\[\]\]},{"id":"11853f18ec8773ce","type":"ui-text","z":"4aad778b57d4f47b","group":"bd4b3eed126bd60e","order":8,"width":0,"height":0,"name":"Text","label":"Static label","format":"{{msg.payload}}","layout":"row-spread","style":false,"font":"","fontSize":16,"color":"#717171","className":"","x":1950,"y":2200,"wires":\[\]},{"id":"47e417fd8d289a18","type":"ui-text-input","z":"4aad778b57d4f47b","group":"bd4b3eed126bd60e","name":"Text input (single line)","label":"Static label","order":9,"width":0,"height":0,"topic":"topic","topicType":"msg","mode":"text","tooltip":"","delay":300,"passthru":true,"sendOnDelay":false,"sendOnBlur":true,"sendOnEnter":true,"className":"","clearable":false,"sendOnClear":false,"icon":"","iconPosition":"left","iconInnerPosition":"inside","x":2000,"y":2240,"wires":\[\[\]\]},{"id":"ee804a9ead3af9c9","type":"inject","z":"4aad778b57d4f47b","name":"Plain text label","props":\[{"p":"ui\_update.label","v":"Plain text","vt":"str"}\],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":1680,"y":1920,"wires":\[\["d06b475b0dc03d4b","3957a5ca24d0a8c0","805544beee60b59e","3cab92ecc8c62250","7b2f3c4e68f76fc6","952c3a4bc1aedcb9","11853f18ec8773ce","feef390550d2dc22","ddb30c1fa5b2fa01","47e417fd8d289a18"\]\]},{"id":"d1e7cda10b8d2729","type":"inject","z":"4aad778b57d4f47b","name":"Html label","props":\[{"p":"ui\_update.label","v":"\<p style=\\"color: red; font-weight: bold; text-decoration: underline;\\"\>Html text\</p\>","vt":"str"}\],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":1700,"y":1960,"wires":\[\["d06b475b0dc03d4b","3957a5ca24d0a8c0","805544beee60b59e","3cab92ecc8c62250","7b2f3c4e68f76fc6","952c3a4bc1aedcb9","11853f18ec8773ce","47e417fd8d289a18","feef390550d2dc22","ddb30c1fa5b2fa01"\]\]},{"id":"feef390550d2dc22","type":"ui-text-input","z":"4aad778b57d4f47b","group":"bd4b3eed126bd60e","name":"Text input (multi line)","label":"Static label","order":10,"width":0,"height":0,"topic":"topic","topicType":"msg","mode":"textarea","tooltip":"","delay":300,"passthru":true,"sendOnDelay":false,"sendOnBlur":true,"sendOnEnter":true,"className":"","clearable":false,"sendOnClear":false,"icon":"","iconPosition":"left","iconInnerPosition":"inside","x":2000,"y":2280,"wires":\[\[\]\]},{"id":"ddb30c1fa5b2fa01","type":"ui-dropdown","z":"4aad778b57d4f47b","group":"bd4b3eed126bd60e","name":"Dropdown (select)","label":"Static label","tooltip":"","order":4,"width":0,"height":0,"passthru":false,"multiple":false,"chips":false,"clearable":false,"options":\[{"label":"Value 1","value":"value1","type":"str"},{"label":"Value 2","value":"value2","type":"str"}\],"payload":"","topic":"topic","topicType":"msg","className":"","typeIsComboBox":false,"x":1990,"y":2040,"wires":\[\[\]\]},{"id":"bd4b3eed126bd60e","type":"ui-group","name":"Html labels demo","page":"febf51051870b4b5","width":"6","height":"1","order":1,"showTitle":true,"className":"","visible":"true","disabled":"false"},{"id":"febf51051870b4b5","type":"ui-page","name":"Experimenten labels","ui":"be29745a6e568f30","path":"/experiment\_labels","icon":"home","layout":"grid","theme":"a965ccfef139317a","breakpoints":\[{"name":"Default","px":"0","cols":"3"},{"name":"Tablet","px":"576","cols":"6"},{"name":"Small Desktop","px":"768","cols":"9"},{"name":"Desktop","px":"1024","cols":"12"}\],"order":1,"className":"","visible":"true","disabled":"false"},{"id":"be29745a6e568f30","type":"ui-base","name":"UI Name","path":"/dashboard","includeClientData":true,"acceptsClientConfig":\["ui-notification","ui-control","ui-chart","ui-text-input","ui-dropdown"\],"showPathInSidebar":false,"showPageTitle":true,"navigationStyle":"icon","titleBarStyle":"default"},{"id":"a965ccfef139317a","type":"ui-theme","name":"Default","colors":{"surface":"#404040","primary":"#109fbc","bgPage":"#e8e8e8","groupBg":"#d6d6d6","groupOutline":"#6fbc10"},"sizes":{"pagePadding":"12px","groupGap":"12px","groupBorderRadius":"4px","widgetGap":"12px"}}\]
> \`\`\`
> 
> I 'think' this PR covers all ui node types that have a label.
> 
> \## Related Issue(s)
> 
> \[1346\](https://github.com/FlowFuse/node-red-dashboard/issues/1346)
> 
> \## Checklist
> 
> 
> 
> - \[\] I have read the \[contribution guidelines\](https://github.com/FlowFuse/flowfuse/blob/main/CONTRIBUTING.md)
> - \[\] Suitable unit/system level tests have been added and they pass 
> - \[\] Documentation has been updated
> - \[\] Upgrade instructions
> - \[\] Configuration details
> - \[\] Concepts
> - \[\] Changes \`flowforge.yml\`?
> - \[\] Issue/PR raised on \`FlowFuse/helm\` to update ConfigMap Template
> - \[\] Issue/PR raised on \`FlowFuse/CloudProject\` to update values for Staging/Production
> 
> \## Labels
> 
> - \[\] Includes a DB migration? -\> add the \`area:migration\` label

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [9 November 2024 21:37 UTC](https://discourse.nodered.org/t/non-breaking-space-is-not-treated-in-ui-update-label/92071/5 "2024-11-09T21:37:48Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.