node-red-contrib-uibuilder/docs/nodes/function-node.md

Easily create data-driven web UI's for Node-RED. Single- & Multi-page. Multiple UI's. Work with existing web development workflows or mix and match with no-code/low-code features.

---
title: Enhancements to the Node-RED function node
description: |
  UIBUILDER adds some functional extensions to Node-RED's Function Node. This page describes them.
  The functions are all added to the uib namespace of the RED.util object, so they can be used in any function node without needing to require or import anything.
created: 2024-06-14 20:53:10
updated: 2026-05-23 15:44:56
---

> [!TIP]
> Node-RED's Monaco web code editor provides autocompletion for these functions, so you can just start typing `RED.util.uib.` in a function node and the list of available functions will appear. Selecting one of the functions from the list will show a tooltip with the function's parameters and description.

## `deepObjFind` - Deep object find :id=deep-object-find

`RED.util.uib.deepObjFind(obj, matcher, cb)` will search into a deeply nested object for a match and then call a callback function with the object that matched.

If the `matcher` function finds a match, the `cb` function will be called. The search will continue down any number of nested object levels to find a match.

> [!WARNING]
> Take care not to run this against an recursive JavaScript object structure as it will eventually cause a stack overflow.

### Parameters

* `obj` is the object to be searched.
* `matcher` is a function that receives the object as its only parameter, if the function returns TRUE, the callback function will be called.
* `cb` is a callback function that takes a single argument `obj`.

### Example

```javascript
/**
 * Update the STYLE of the uib low-code table definition
 * if the NoRead column is >= 20
 * 
 * Using CSS variables from uib-brand.css.
 * 
 * In the example, we use a style attribute
 * but in live, best to define and use a class.
 */

// Search for the first `tbody` definition
const matcher = (obj) => obj.type === 'tbody'

// If found, process each row of the table body
const cb = (obj) => {
  // node.warn(obj.components)
  const tblRows = obj.components

  // Process every table row
  tblRows.forEach(row => {
    // ref to the row's NoRead column (10th column)
    const noRead = row.components[9]

    // Get the "slot" which is the data displayed in the cell
    if (noRead.slot >= 20) {
      // If the data >= 20, add some extra style just to the cell
      noRead.attributes.style = 'background-color: var(--failure); font-weight: bold;'

      // And/OR add formatting to the whole row
      row.attributes.style = 'background-color: var(--warning);'
    }
  })

  node.send(msg)
}

RED.util.uib.deepObjFind(msg._ui, matcher, cb)
```


## `dp` - Decimal places :id=decimal-places

`RED.util.uib.dp(inp, dp, int)` returns a _string representation_ of an input _number_ formatted to the given number of decimal places and locale.

### Parameters

* `inp` is the input number.
* `dp` defaults to 1 decimal place.
* `int` defaults to `en-GB` locale.

### Example

```javascript
// Assuming msg.payload = 1234.5678
msg.payload = RED.util.uib.dp(msg.payload, 2, 'en-GB')

return msg
// Returns "1,234.57" in the payload
```

## `listAllApps` - List all uibuilder instances (Apps) :id=list-all-apps

`RED.util.uib.listAllApps()` returns a list object containing all of the uibuilder nodes and some details about them.

### Example output

```json
{
  "uib-element-test": {
    "node":"90794d03f65a40d4",
    "url":"uib-element-test",
    "title":"Zero-code examples",
    "descr":"A collection of flows that demonstrate and test all of the uib-element node's output types."
  },
  // ...
}
```

> [!NOTE]
> The title and description for an instance is set in the uibuilder node's advanced configuration tab.

## `renderToHTML` (since v7.7.0) - Render JSON to HTML :id=render-to-html

`RED.util.uib.renderToHTML(obj)` takes a JavaScript object and renders it to HTML using the [`saferSerialize`](#safer-serialize) function. This allows you to render complex (or simple) data to HTML without needing worring about serialization errors.

## `saferSerialize` (since v7.7.0) - Serialize JavaScript object data without errors :id=safer-serialize

`RED.util.uib.saferSerialize(obj)` takes a JavaScript object and returns a string representation without throwing errors due to circular references, functions, or other non-serializable data types. This is particularly useful for logging or debugging complex objects in Node-RED function nodes.

## `send` - Send a message to uibuilder connected clients :id=send

`RED.util.uib.send(uibname, msg)` will send a message to all connected clients of the specified uibuilder instance. The usual message routing, middleware and filtering rules apply.

 ### Parameters
 
 * `uibname` is the name (url) of a uibuilder instance. Sends a message to any connected clients of that instance.
 * `msg` is any valid Node-RED message object.

> [!NOTE]
> This obviously bypasses any `uib-cache` nodes you might be using so messages sent this way will not be cached for new clients.

## `truthy` - Check if value is truthy :id=truthy

`RED.util.uib.truthy(inp)` returns TRUE if the input is "[truthy](https://developer.mozilla.org/en-US/docs/Glossary/Truthy)", otherwise FALSE.

This function is also available in the uibuilder client library as `uibuilder.truthy(inp)` for use in your front-end code.

### Parameters

Any of following inputs will return TRUE:
'on', 'On', 'ON', 'true', 'True', 'TRUE', '1', true, 1

Any of following inputs will return FALSE:
'off', 'Off', 'OFF', 'false', 'False', 'FALSE', '0', false, 0

### Example

```javascript
// All these output TRUE
node.warn( RED.util.uib.truthy("True") )
node.warn( RED.util.uib.truthy("On") )
node.warn( RED.util.uib.truthy(1) )
```