# \#ui-widgets

**URL:** https://discourse.nodered.org/tag/ui-widgets/21.md

[Latest](https://discourse.nodered.org/latest.md) · [Categories](https://discourse.nodered.org/categories.md) · [Tags](https://discourse.nodered.org/tags.md)

---

## [Get the id value (from db) and add it to the output of a ui-form?](https://discourse.nodered.org/t/get-the-id-value-from-db-and-add-it-to-the-output-of-a-ui-form/92992)

<div class="topic-metadata">

**Author:** [@Pepex7](https://discourse.nodered.org/u/Pepex7)\
**Replies:** 25\
**Last updated:** [9 November 2024 09:14 UTC](https://discourse.nodered.org/t/get-the-id-value-from-db-and-add-it-to-the-output-of-a-ui-form/92992 "2024-11-09T09:14:52Z")

</div>

I'm trying to do an update on a database record (postgres) with a ui-form (Dashboard 2), but I can't pass the id to the ui-form. I don't get the id in the ui-form output so I can make the query and pass the id to modi…

---

## [Dashboard 2 gauge dynamic label assignment issue](https://discourse.nodered.org/t/dashboard-2-gauge-dynamic-label-assignment-issue/90856)

<div class="topic-metadata">

**Author:** [@ncuxonama](https://discourse.nodered.org/u/ncuxonama)\
**Replies:** 6\
**Last updated:** [14 September 2024 11:08 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-dynamic-label-assignment-issue/90856 "2024-09-14T11:08:32Z")

</div>

Hello everyone. I have the following issue. I am trying to set a dynamic lable for one of my gauges and I have read the documentation about it stating that as long as I send msg.ui\_update.title with a value pair the titl…

---

## [Updating props from serverside.js at runtime](https://discourse.nodered.org/t/updating-props-from-serverside-js-at-runtime/90155)

<div class="topic-metadata">

**Author:** [@wangenkuesse](https://discourse.nodered.org/u/wangenkuesse)\
**Replies:** 6\
**Last updated:** [14 August 2024 14:44 UTC](https://discourse.nodered.org/t/updating-props-from-serverside-js-at-runtime/90155 "2024-08-14T14:44:11Z")

</div>

Hello everyone... I am trying to build a third party widget. It consists of a v-btn-toggle, a slider an one other button (and some other elements). When i toggle, i am able to emit a custom event, receive that event at…

---

## [Create custom ui node in Dashboard 2](https://discourse.nodered.org/t/create-custom-ui-node-in-dashboard-2/87801)

<div class="topic-metadata">

**Author:** [@greenDog](https://discourse.nodered.org/u/greenDog)\
**Replies:** 35\
**Last updated:** [16 June 2024 08:58 UTC](https://discourse.nodered.org/t/create-custom-ui-node-in-dashboard-2/87801 "2024-06-16T08:58:34Z")

</div>

I want to create a custom ui node for Dashboard 2 in Node-RED. Where can I include my HTML code to be displayed on the dashboard? Do I need to integrate the code into the html or js file? Or is it necessary to create a …

---

## [How to control a dashboard widget using ui\_control](https://discourse.nodered.org/t/how-to-control-a-dashboard-widget-using-ui-control/88147)

<div class="topic-metadata">

**Author:** [@CS012019](https://discourse.nodered.org/u/CS012019)\
**Replies:** 1\
**Last updated:** [21 May 2024 15:21 UTC](https://discourse.nodered.org/t/how-to-control-a-dashboard-widget-using-ui-control/88147 "2024-05-21T15:21:34Z")

</div>

Hi all. Is it possible to control just one widget using ui\_control? I have two buttons in one group. I would like only one of these buttons to be displayed based on a boolean. Thanks

---

## [Dashboard 2.0 custom ui-widget creation: how to tell size when auto is specified](https://discourse.nodered.org/t/dashboard-2-0-custom-ui-widget-creation-how-to-tell-size-when-auto-is-specified/87877)

<div class="topic-metadata">

**Author:** [@Colin](https://discourse.nodered.org/u/Colin)\
**Replies:** 6\
**Last updated:** [14 May 2024 08:44 UTC](https://discourse.nodered.org/t/dashboard-2-0-custom-ui-widget-creation-how-to-tell-size-when-auto-is-specified/87877 "2024-05-14T08:44:48Z")

</div>

I am creating (or attempting to create) a custom D2 ui-widget. I need to know the actual size (eg 4x3). If the user specifies a size then width and height are available in this.props, but if it is configured as auto th…

---

## [Custom node appearance and event handlers. Proof on concept: Inline Gauge](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001)

<div class="topic-metadata">

**Author:** [@johnebgood](https://discourse.nodered.org/u/johnebgood)\
**Replies:** 46\
**Last updated:** [8 December 2023 12:09 UTC](https://discourse.nodered.org/t/custom-node-appearance-and-event-handlers-proof-on-concept-inline-gauge/83001 "2023-12-08T12:09:52Z")

</div>

I created an editor inline gauge however there are some interface elements that are rendered underneath my canvas output, the mouse cursor changes to the move cursor when I mouse over however I can't click or drag on the…

---

## [UI node Switch ON/OFF](https://discourse.nodered.org/t/ui-node-switch-on-off/81776)

<div class="topic-metadata">

**Author:** [@CONNECT](https://discourse.nodered.org/u/CONNECT)\
**Replies:** 0\
**Last updated:** [4 October 2023 16:44 UTC](https://discourse.nodered.org/t/ui-node-switch-on-off/81776 "2023-10-04T16:44:46Z")

</div>

Node Switch settings

---

## [Text\_input logic in Node-red Dashboard](https://discourse.nodered.org/t/text-input-logic-in-node-red-dashboard/81242)

<div class="topic-metadata">

**Author:** [@sercancetin](https://discourse.nodered.org/u/sercancetin)\
**Replies:** 3\
**Last updated:** [13 September 2023 08:20 UTC](https://discourse.nodered.org/t/text-input-logic-in-node-red-dashboard/81242 "2023-09-13T08:20:05Z")

</div>

Hello everyone, I am making widgets like in the video. The point I use as reference is the knot red instrument panel. In "text entry" in the Node-red control panel, data is not lost when the page is refreshed and data is…

---

## [Changing a Dashboard Image upon boolean MQTT input](https://discourse.nodered.org/t/changing-a-dashboard-image-upon-boolean-mqtt-input/78874)

<div class="topic-metadata">

**Author:** [@aresh](https://discourse.nodered.org/u/aresh)\
**Replies:** 6\
**Last updated:** [5 June 2023 17:06 UTC](https://discourse.nodered.org/t/changing-a-dashboard-image-upon-boolean-mqtt-input/78874 "2023-06-05T17:06:27Z")

</div>

Hi, I'm fairly new to NodeRed, and I've been scratching my head on how to change a picture upon a boolean input. The thing that I want the program to do is display a certain image if the input is true, and display anoth…

---

## [Highlighting Rows in UI-Table](https://discourse.nodered.org/t/highlighting-rows-in-ui-table/78057)

<div class="topic-metadata">

**Author:** [@Jdo300](https://discourse.nodered.org/u/Jdo300)\
**Replies:** 1\
**Last updated:** [1 May 2023 04:09 UTC](https://discourse.nodered.org/t/highlighting-rows-in-ui-table/78057 "2023-05-01T04:09:48Z")

</div>

Hello all. I'm working with a UI-Table dashboard node and I want to be able to highlight rows in the table and have the highlighted row stay highlighted after the focus leaves the table. Is there any simple way to implem…

---

## [More then one icon in UI](https://discourse.nodered.org/t/more-then-one-icon-in-ui/76167)

<div class="topic-metadata">

**Author:** [@DeWoAlliSeged7](https://discourse.nodered.org/u/DeWoAlliSeged7)\
**Replies:** 10\
**Last updated:** [6 March 2023 10:37 UTC](https://discourse.nodered.org/t/more-then-one-icon-in-ui/76167 "2023-03-06T10:37:27Z")

</div>

Hello I like to give a button multiple icons. In fact i like to make three question marks in different colors. \> class="fas fa-question fa-2x"\>\</i\>i class="fas fa-question fa-2x"\>\</i\>i class="fas fa-question fa-2x"\>\</…

---

## [Slider type of control with non-limited min and max](https://discourse.nodered.org/t/slider-type-of-control-with-non-limited-min-and-max/73632)

<div class="topic-metadata">

**Author:** [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Replies:** 8\
**Last updated:** [23 January 2023 11:00 UTC](https://discourse.nodered.org/t/slider-type-of-control-with-non-limited-min-and-max/73632 "2023-01-23T11:00:12Z")

</div>

Just for fun. Nothing too fancy but may come useful for some edge cases :slight\_smile: Slide the ribbon to left or right to decrease or increase the desired change amount. Sends payload on release. \[{"id":"13cbb8f5ac3…

---

## [Ng-model checkbox](https://discourse.nodered.org/t/ng-model-checkbox/73610)

<div class="topic-metadata">

**Author:** [@dpatel2016](https://discourse.nodered.org/u/dpatel2016)\
**Replies:** 0\
**Last updated:** [12 January 2023 20:32 UTC](https://discourse.nodered.org/t/ng-model-checkbox/73610 "2023-01-12T20:32:10Z")

</div>

I have the following code in the template node, but whenever I inject payload to this checkbox, the manual click on the button on the dashboard becomes ineffective until I keep clicking it 2 times. \<label class="switch…

---

## [Gauge to Angular with simple setup](https://discourse.nodered.org/t/gauge-to-angular-with-simple-setup/73021)

<div class="topic-metadata">

**Author:** [@immortalserg](https://discourse.nodered.org/u/immortalserg)\
**Replies:** 2\
**Last updated:** [1 January 2023 22:15 UTC](https://discourse.nodered.org/t/gauge-to-angular-with-simple-setup/73021 "2023-01-01T22:15:45Z")

</div>

modified \[ { "id": "58bada2924a21caf", "type": "function", "z": "21b213583fe2216f", "name": "gauge\_data", "func": "let gzone = \[\]; let gtick2 = \[\];\\n\\nvalue = msg.payload\\n…

---

## [Mechanical counter display](https://discourse.nodered.org/t/mechanical-counter-display/72078)

<div class="topic-metadata">

**Author:** [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Replies:** 29\
**Last updated:** [18 December 2022 10:20 UTC](https://discourse.nodered.org/t/mechanical-counter-display/72078 "2022-12-18T10:20:22Z")

</div>

Just for fun. \[{"id":"656888cd7308428e","type":"inject","z":"bf0d83d32eec75c2","name":"","props":\[{"p":"payload"},{"p":"topic","vt":"str"}\],"repeat":"1","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"…

---

## [An oldshcool gauge](https://discourse.nodered.org/t/an-oldshcool-gauge/72313)

<div class="topic-metadata">

**Author:** [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Replies:** 4\
**Last updated:** [17 December 2022 09:32 UTC](https://discourse.nodered.org/t/an-oldshcool-gauge/72313 "2022-12-17T09:32:35Z")

</div>

Just for fun. \[{"id":"1e1a0b8d6b5f1c5a","type":"ui\_template","z":"bf0d83d32eec75c2","group":"55888982bdd0637f","name":"oldscool-gauge with blue negative digits","order":6,"width":"6","height":"1","format":"\<style\>\\n …

---

## [Issue with Dashboard UI. Generating UI elements with subflows](https://discourse.nodered.org/t/issue-with-dashboard-ui-generating-ui-elements-with-subflows/71862)

<div class="topic-metadata">

**Author:** [@HerrTuulik](https://discourse.nodered.org/u/HerrTuulik)\
**Replies:** 12\
**Last updated:** [8 December 2022 23:07 UTC](https://discourse.nodered.org/t/issue-with-dashboard-ui-generating-ui-elements-with-subflows/71862 "2022-12-08T23:07:23Z")

</div>

Using latest versions. I have a subflow that generates UI elements for a device. heartbeat and relay status for some reason aren't displayed like the others. I can't figure out what is causing this. Each variable ty…

---

## [Widget Alignment](https://discourse.nodered.org/t/widget-alignment/69414)

<div class="topic-metadata">

**Author:** [@Limninzz](https://discourse.nodered.org/u/Limninzz)\
**Replies:** 3\
**Last updated:** [22 October 2022 08:06 UTC](https://discourse.nodered.org/t/widget-alignment/69414 "2022-10-22T08:06:11Z")

</div>

Hello, could somebody please guide me how to align widget ? i use node-red dashboard and custom template with css. And i want to move "Slider widget" to the bottom of "Gauge Widget" just like the picture attached.

---

## [Node-red-node-ui-table pdf download is missing the Group count](https://discourse.nodered.org/t/node-red-node-ui-table-pdf-download-is-missing-the-group-count/69015)

<div class="topic-metadata">

**Author:** [@akd02](https://discourse.nodered.org/u/akd02)\
**Replies:** 6\
**Last updated:** [18 October 2022 07:47 UTC](https://discourse.nodered.org/t/node-red-node-ui-table-pdf-download-is-missing-the-group-count/69015 "2022-10-18T07:47:12Z")

</div>

Hello Everyone, I am using the ui\_table node on a dashboard. all works well, including exporting / downloading a PDF file from the data shown in the table. On the dashbiard itself i can see the count of objects / rows…

---

## [Looking for an 'energy distribution' chart for a home similar to](https://discourse.nodered.org/t/looking-for-an-energy-distribution-chart-for-a-home-similar-to/67368)

<div class="topic-metadata">

**Author:** [@samos](https://discourse.nodered.org/u/samos)\
**Replies:** 12\
**Last updated:** [15 October 2022 08:57 UTC](https://discourse.nodered.org/t/looking-for-an-energy-distribution-chart-for-a-home-similar-to/67368 "2022-10-15T08:57:49Z")

</div>

Hello, I'm searching for something like this energy distribution chart that I can push my data into, so that it can render a pretty 'animated flow' of energy amongst power consumption and power generation sources. pic a…

---

## [Sending user input in a UI Template as a msg.payload](https://discourse.nodered.org/t/sending-user-input-in-a-ui-template-as-a-msg-payload/66241)

<div class="topic-metadata">

**Author:** [@cleroux](https://discourse.nodered.org/u/cleroux)\
**Replies:** 1\
**Last updated:** [9 August 2022 17:49 UTC](https://discourse.nodered.org/t/sending-user-input-in-a-ui-template-as-a-msg-payload/66241 "2022-08-09T17:49:49Z")

</div>

I am new to node-red and have been trying to use a UI template node to allow a user to enter multiline comments. I want to output the entered text as a string to msg.payload and this is the closest I have been able to ge…

---

## [Dashboard layout](https://discourse.nodered.org/t/dashboard-layout/65460)

<div class="topic-metadata">

**Author:** [@FatimaSeemab](https://discourse.nodered.org/u/FatimaSeemab)\
**Replies:** 6\
**Last updated:** [3 August 2022 08:35 UTC](https://discourse.nodered.org/t/dashboard-layout/65460 "2022-08-03T08:35:41Z")

</div>

Hi, i need help. I have the following layout and I want my elements to be arranged like this but somehow it is giving me the following output could anyone help me. I want the sidebar to the leftmost side and bar c…

---

## [Tracking visibility status of a node](https://discourse.nodered.org/t/tracking-visibility-status-of-a-node/63686)

<div class="topic-metadata">

**Author:** [@DanielEcheverri](https://discourse.nodered.org/u/DanielEcheverri)\
**Replies:** 0\
**Last updated:** [9 June 2022 14:58 UTC](https://discourse.nodered.org/t/tracking-visibility-status-of-a-node/63686 "2022-06-09T14:58:15Z")

</div>

Hi. I have created three switch toggles (ui-switch) to control the visibility of three groups (B, Y, and Dev). Each group makes an HTTP GET request to a server and displays the values of two variables (A and B) on two te…

---

## [Ui-level node without min/max values?](https://discourse.nodered.org/t/ui-level-node-without-min-max-values/63510)

<div class="topic-metadata">

**Author:** [@stefan24](https://discourse.nodered.org/u/stefan24)\
**Replies:** 2\
**Last updated:** [6 June 2022 21:42 UTC](https://discourse.nodered.org/t/ui-level-node-without-min-max-values/63510 "2022-06-06T21:42:31Z")

</div>

@hotNipi, (how) can I disable the min and max values? I want to use ui\_level for the current position of my roller shutter and do not need these values.

---

## [Adding a Node-RED-Dashboard UI widget node makes everything else disappear](https://discourse.nodered.org/t/adding-a-node-red-dashboard-ui-widget-node-makes-everything-else-disappear/62184)

<div class="topic-metadata">

**Author:** [@CBianca](https://discourse.nodered.org/u/CBianca)\
**Replies:** 16\
**Last updated:** [28 May 2022 11:21 UTC](https://discourse.nodered.org/t/adding-a-node-red-dashboard-ui-widget-node-makes-everything-else-disappear/62184 "2022-05-28T11:21:06Z")

</div>

When I add an UI widget, in my case node-red-node-ui-table, everything that existed before on the dashboard dissapears (theme also returns to the default one), even my side bar menu. Only the widget is shown: I can'…

---

## [Subflow property for selecting ui group](https://discourse.nodered.org/t/subflow-property-for-selecting-ui-group/61128)

<div class="topic-metadata">

**Author:** [@finlay\_morrison](https://discourse.nodered.org/u/finlay_morrison)\
**Replies:** 1\
**Last updated:** [11 April 2022 15:49 UTC](https://discourse.nodered.org/t/subflow-property-for-selecting-ui-group/61128 "2022-04-11T15:49:56Z")

</div>

I am trying to create a subflow which houses functionality for dealing with a single type of data that my sensors relay back. I would like to be able to select the ui group that a specific instance of a subflow should us…

---

## [\[SOLVED\] Invisible line in graph due to null data returned from influxdb query](https://discourse.nodered.org/t/solved-invisible-line-in-graph-due-to-null-data-returned-from-influxdb-query/58517)

<div class="topic-metadata">

**Author:** [@sdrshnptl](https://discourse.nodered.org/u/sdrshnptl)\
**Replies:** 6\
**Last updated:** [22 February 2022 11:59 UTC](https://discourse.nodered.org/t/solved-invisible-line-in-graph-due-to-null-data-returned-from-influxdb-query/58517 "2022-02-22T11:59:58Z")

</div>

Hello All, I've working with influxdb to plot data from last few hour. As i query for last 8 hour i'm getting "null" where missing values are. below image shows value which are recorded into influx db generate line an…

---

## [\[DUPLICATE THREAD\] Call monitoring using node red](https://discourse.nodered.org/t/duplicate-thread-call-monitoring-using-node-red/58446)

<div class="topic-metadata">

**Author:** [@Umar\_Amjad](https://discourse.nodered.org/u/Umar_Amjad)\
**Replies:** 2\
**Last updated:** [16 February 2022 12:03 UTC](https://discourse.nodered.org/t/duplicate-thread-call-monitoring-using-node-red/58446 "2022-02-16T12:03:56Z")

</div>

Hi, I want to build a node red flow for call monitoring on my kamailio server using UI widgets. Can any when help?

---

## [How can we monitor calls on kamailio server using node-red?](https://discourse.nodered.org/t/how-can-we-monitor-calls-on-kamailio-server-using-node-red/58445)

<div class="topic-metadata">

**Author:** [@Umar\_Amjad](https://discourse.nodered.org/u/Umar_Amjad)\
**Replies:** 1\
**Last updated:** [16 February 2022 12:02 UTC](https://discourse.nodered.org/t/how-can-we-monitor-calls-on-kamailio-server-using-node-red/58445 "2022-02-16T12:02:59Z")

</div>

Hi, i need help regarding how can we create a node red dashboard to monitor number of calls landed on a kamailio server. what nodes can be used for user interface such as graphs and ui\_guage? Kindly anyone help me out w…

[Next page](https://discourse.nodered.org/tag/ui-widgets/21.md?match_all_tags=true&page=1&tags%5B%5D=ui-widgets)
