Change value shown on the slider

Dashboard
1

I'm using a slider to set some limits for a variable selected from a drop-down list. One variable has values in the range of 1000-2000 while others are in the range of 10-100. I set the slider range to 10 - 100 and then use a function node to map it to the range I want.

It is confusing to the dashboard user when the slider shows the value on the top because the range is from 1000 - 2000 but the slider shows values from 20 - 100. Is there a way to change this?
ooo

ooo
ooo970Ă—87 22.1 KB

2

You can change the slider options on fly using msg.ui_control

[
    {
        "id": "7bf0c2fe4fdb3f73",
        "type": "ui_slider",
        "z": "98fb9802851faeed",
        "name": "",
        "label": "slider",
        "tooltip": "",
        "group": "20ae1040.3cf58",
        "order": 2,
        "width": 0,
        "height": 0,
        "passthru": true,
        "outs": "end",
        "topic": "topic",
        "topicType": "msg",
        "min": 0,
        "max": 10,
        "step": 1,
        "className": "",
        "x": 620,
        "y": 800,
        "wires": [
            []
        ]
    },
    {
        "id": "95c7854bad2bcaaf",
        "type": "change",
        "z": "98fb9802851faeed",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "ui_control",
                "pt": "msg",
                "to": "{}",
                "tot": "json"
            },
            {
                "t": "set",
                "p": "ui_control.min",
                "pt": "msg",
                "to": "100",
                "tot": "num"
            },
            {
                "t": "set",
                "p": "ui_control.max",
                "pt": "msg",
                "to": "1000",
                "tot": "num"
            },
            {
                "t": "delete",
                "p": "payload",
                "pt": "msg"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 410,
        "y": 800,
        "wires": [
            [
                "7bf0c2fe4fdb3f73"
            ]
        ]
    },
    {
        "id": "14bf6e76d5522877",
        "type": "change",
        "z": "98fb9802851faeed",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "ui_control",
                "pt": "msg",
                "to": "{}",
                "tot": "json"
            },
            {
                "t": "set",
                "p": "ui_control.min",
                "pt": "msg",
                "to": "1",
                "tot": "num"
            },
            {
                "t": "set",
                "p": "ui_control.max",
                "pt": "msg",
                "to": "10",
                "tot": "num"
            },
            {
                "t": "delete",
                "p": "payload",
                "pt": "msg"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 410,
        "y": 840,
        "wires": [
            [
                "7bf0c2fe4fdb3f73"
            ]
        ]
    },
    {
        "id": "9fe26f09e14bd6e4",
        "type": "ui_button",
        "z": "98fb9802851faeed",
        "name": "",
        "group": "20ae1040.3cf58",
        "order": 3,
        "width": 0,
        "height": 0,
        "passthru": false,
        "label": "100-1000",
        "tooltip": "",
        "color": "",
        "bgcolor": "",
        "className": "",
        "icon": "",
        "payload": "1",
        "payloadType": "str",
        "topic": "topic",
        "topicType": "msg",
        "x": 200,
        "y": 800,
        "wires": [
            [
                "95c7854bad2bcaaf"
            ]
        ]
    },
    {
        "id": "a2bbc92a2efa3c3d",
        "type": "ui_button",
        "z": "98fb9802851faeed",
        "name": "",
        "group": "20ae1040.3cf58",
        "order": 3,
        "width": 0,
        "height": 0,
        "passthru": false,
        "label": "1-10",
        "tooltip": "",
        "color": "",
        "bgcolor": "",
        "className": "",
        "icon": "",
        "payload": "1",
        "payloadType": "str",
        "topic": "topic",
        "topicType": "msg",
        "x": 190,
        "y": 840,
        "wires": [
            [
                "14bf6e76d5522877"
            ]
        ]
    },
    {
        "id": "20ae1040.3cf58",
        "type": "ui_group",
        "name": "Slider",
        "tab": "6b520bda.e997a4",
        "order": 1,
        "disp": true,
        "width": "6",
        "collapse": false,
        "className": ""
    },
    {
        "id": "6b520bda.e997a4",
        "type": "ui_tab",
        "name": "Testing",
        "icon": "dashboard",
        "order": 1,
        "disabled": false,
        "hidden": false
    }
]
1 Like
3

@hotNipi Thank you but I'm new to Node-Red. Where do I have to add this code?

4

Maybe this helps then ..
https://nodered.org/docs/user-guide/editor/workspace/import-export

5

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