Numeric Input number with decimal places

Dashboard
1

Hey all.

I'm building a dashboard UI and ran into an issue. I've dynamically set the min, max, step, and format via sending a msg.ui_control object with no issues. The problem then comes when I try to dynamically input a number with decimal places. Here is an example:

input node with 2.5 sent to the numeric as the payload. Numeric will then display a 3 and not 2.5. It appears that the Numeric is taking the payload and rounding to the nearest integer. Can someone shed some light on this? Is this supposed to happen? I'd like it to accept the number that I provide via the input (2.5, 2.75, 5.75, etc.). Here is my code for reference:

[
    {
        "id": "a2817fb1.a78d7",
        "type": "inject",
        "z": "37e80d8d.af11b2",
        "name": "",
        "topic": "",
        "payload": "2.50",
        "payloadType": "num",
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "x": 490,
        "y": 4620,
        "wires": [
            [
                "d5ff3850.9179b8"
            ]
        ]
    },
    {
        "id": "491cfd1c.48ec84",
        "type": "inject",
        "z": "37e80d8d.af11b2",
        "name": "",
        "topic": "",
        "payload": "",
        "payloadType": "date",
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "x": 300,
        "y": 4700,
        "wires": [
            [
                "937176f2.459188"
            ]
        ]
    },
    {
        "id": "937176f2.459188",
        "type": "function",
        "z": "37e80d8d.af11b2",
        "name": "sets Parameters",
        "func": "msg.ui_control = {\n    \"min\": 0,\n    \"max\": 5,\n    \"step\": 0.25,\n    \"format\": \"{{value | number:4}}\"\n};\nmsg.payload = 1;\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "x": 460,
        "y": 4700,
        "wires": [
            [
                "d5ff3850.9179b8"
            ]
        ]
    },
    {
        "id": "640af37d.6a200c",
        "type": "debug",
        "z": "37e80d8d.af11b2",
        "name": "",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "true",
        "targetType": "full",
        "x": 790,
        "y": 4700,
        "wires": []
    },
    {
        "id": "d5ff3850.9179b8",
        "type": "ui_numeric",
        "z": "37e80d8d.af11b2",
        "name": "",
        "label": "numeric",
        "tooltip": "",
        "group": "f9439bec.8f69e8",
        "order": 1,
        "width": 0,
        "height": 0,
        "wrap": false,
        "passthru": true,
        "topic": "",
        "format": "{{value | number:2}}",
        "min": 0,
        "max": 10,
        "step": 1,
        "x": 640,
        "y": 4700,
        "wires": [
            [
                "640af37d.6a200c"
            ]
        ]
    },
    {
        "id": "adc3e2d8.d8085",
        "type": "inject",
        "z": "37e80d8d.af11b2",
        "name": "",
        "topic": "",
        "payload": "2.35",
        "payloadType": "num",
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "x": 490,
        "y": 4580,
        "wires": [
            [
                "d5ff3850.9179b8"
            ]
        ]
    },
    {
        "id": "f9439bec.8f69e8",
        "type": "ui_group",
        "z": "",
        "name": "Test",
        "tab": "98b94b1.92c47b8",
        "order": 1,
        "disp": false,
        "width": "8",
        "collapse": false
    },
    {
        "id": "98b94b1.92c47b8",
        "type": "ui_tab",
        "z": "",
        "name": "Numeric Test",
        "icon": "dashboard",
        "disabled": false,
        "hidden": false
    }
]
2

Are you perhaps using an integer when a float would be a better option?

3

I'm not clear on what you mean. Can you be more specific? Did you try the code I pasted? It's easier to try my flow to see what happens. Thanks!

4

I took a look. You need to set the step size on your numeric node. Do you need the numeric adjustment on the dashboard for your purposes, or will it be display only?

1 Like
5

Change step in the numeric node to the resolution you want, for example 0.01

1 Like
6

According to https://github.com/node-red/node-red-dashboard/blob/master/config-fields.md the step is also configurable option and if sent via msg.ui_control it applies to config but somehow the input messages are still formatted by old or some default rules. That's definitely bug.

1 Like
7

Yes, which is exactly what I tried to do in the function node just before the Numeric. I ended up changing the step to 0.25 in the Numeric. The input node now works as intended but it brings up the same point you've stated above- Why should I have to initially set the numeric step parameter if I'm setting it dynamically? I agree, definitely a bug.

With that said, how do I proceed with notification of this bug? @dceejay?

Edit: thank you @JayDickson, @edje11, and @hotNipi for your help

8
  1. By try to fix and PR (i suspect line 49 in https://github.com/node-red/node-red-dashboard/blob/master/nodes/ui_numeric.js -> convert: ui.toFloat.bind(this, config))
  2. By rising issue in github
  3. By waiting after mentioning master (you already did)
9

Fix pushed to master branch
(not yet on npm)

10

Hello, I have a similar problem, and have set the steps to 0.01. But if the number ends in a 0 it doesn't display the 2 decimal places e.g 2.40 displays as 2.4, 19.00 displays as 19. Is there a way to force the numeric input node to always display 2 decimal places. Many thanks in advance.

11

Yes - just use the angular number filter to set it how you like
image

12

Thanks for that, worked perfectly!!

13

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